/****************************** main.css - ÃƒÆ’Ã‚Â«Ãƒâ€šÃ‚Â©ÃƒÂ¢Ã¢â€šÂ¬Ã‚ÂÃƒÆ’Ã‚Â¬Ãƒâ€šÃ‚ÂÃƒâ€šÃ‚Â¸ css ******************************/
@charset "UTF-8";

/* html { height: 100%; overflow: hidden; } */
body { height: 100%; overflow: hidden; } 

/*---------- fullpage ----------*/
div#fullpage { height: 100%; position: relative; } 

div#fullpage > div { width: 100%; height: 100%; overflow: hidden; position: relative; } 


/* fullpage nav */
body #fp-nav.left {left: calc(45px + 10px); z-index: -1;} 
body #fp-nav ul li { width: 20px; height: 20px; margin: 0 0 20px 0; } 
body #fp-nav ul li:not(:last-child) { margin-bottom: 20px; } 
body #fp-nav ul li:first-child, body .fp-slidesNav ul li:first-child { display: none; } 
#fp-nav ul li a:before,
.fp-slidesNav ul li a:before { content:""; display: none; position: absolute; top: 0; left: 0; width: 20px; height: 20px; border: 1px solid #b80000; border-radius: 50%; } 
body #fp-nav ul li a span, body .fp-slidesNav ul li a span { width: 6px; height: 6px; margin: -3px 0 0 -3px; background: #d9d9d9; } 
    /* active */
body #fp-nav ul li a.active span, body .fp-slidesNav ul li a.active span { background: #b80000; } 
body #fp-nav ul li a.active span, body .fp-slidesNav ul li a.active span,
body #fp-nav ul li:hover a.active span, body .fp-slidesNav ul li:hover a.active span { height: 6px; width: 6px; margin: -3px 0 0 -3px; } 
body #fp-nav ul li a.active:before,
body .fp-slidesNav ul li a.active:before, body #fp-nav ul li:hover a.active:before, body .fp-slidesNav ul li:hover a.active:before {display: block; } 

/*---------- fullpage ----------*/
/* ÃªÂ°Â Ã¬ËœÂÃ¬â€”Â­Ã¬â€”Â Ã«â€Â°Ã«Â¥Â¸ Ã«Â³â‚¬Ã­Ëœâ€¢ */
body.fp-viewing-0 #fp-nav { display: none; } 
body.fp-viewing-3 #fp-nav.left {z-index: 1;}


/*---------- common ----------*/
/*---------- fullpage : scroll event ----------*/
/* down -> up */
.u_down.s_event {opacity: 0;transform: translateY(-70px);transition: 0.5s;}
.u_down.active {opacity: 1;transform: translateX(0);transition: 0.5s;}

/* -------------- */

strong {font-weight: 600;}
.flex {display: flex;justify-content: space-between;}
.page_wrap.pro .flex {flex-wrap: wrap;}
.section .content_area, footer .content_area {position: relative;max-width: 1460px;height: 100%;margin: 0 auto;}
.section .content_area .txt h2 {font-family: 'Roboto', sans-serif;font-size: 48px;font-weight: 600;color: #ef4036;letter-spacing: -1px;margin-bottom: 20px;transition: transform 700ms ease-in-out, opacity 700ms ease 0s;}
.section .content_area .txt h2 strong {color: #111;}
.section .content_area .txt > p {font-size: 20px;font-weight: 300;letter-spacing: -.5px;line-height: 1.4;}
.right_btn {width: 100%;max-width: 1380px;position: absolute;top: 80px;left: 0;right: 0;margin: 0 auto;z-index: 100;text-align: right;}
.right_btn button {border: none;background: transparent;color: #fff;padding: 10px 0 10px 10px;transition: all .3s;}
.right_btn button span {display: inline-block;position: relative;right: 0;vertical-align: -webkit-baseline-middle;font-family: 'Oxanium', sans-serif;font-weight: 300;letter-spacing: 3px;z-index: 10;transition: all .3s;}
.right_btn button p {display: inline-block;position: relative;width: 50px;height: 50px;border: 1px solid #fff;border-radius: 50%;}
.right_btn button p i {vertical-align: -webkit-baseline-middle;}
    /* hover */
.right_btn button:hover span {right: 10px;}
.right_btn button:hover p {background: #fff;}
.right_btn button:hover p i {color: #b80000; font-weight: 600;}


/*---------- Ã¬Å Â¤Ã­ÂÂ¬Ã«Â¡Â¤ Ã¬ÂÂ´Ã«Â²Â¤Ã­Å Â¸ ----------*/
/* fade out -> in */
#section1 .content_area .top p.left.s_event {
    opacity: 0;
    transform: translateY(0%);
    transition: 2s;
}

#section1 .content_area .top p.left.s_event.active {
    opacity: 1;
    transform: translateX(0%);
    transition: 2s;
    transition-delay: 0.3s;
}

/* Ã¬â€¢â€žÃ«Å¾Ëœ -> Ã¬Å“â€ž */
#section2 .content_area > div >.left p span.s_event {
    opacity: 0;
    transform: translateY(30%);
    transition: 0.5s;
}

#section2 .content_area > div >.left p span.s_event.active {
    opacity: 1;
    transform: translateX(0%);
    transition: 0.5s;
}

#section2 .content_area > div >.right div.s_event {
    opacity: 0;
    transform: translateY(50%);
    transition: 1s;
    transition-delay: 0.5s;
}

#section2 .content_area > div >.right div.s_event.active {
    opacity: 1;
    transform: translateX(0%);
    transition: 1s;
    transition-delay: 0.5s;
}

#section2 .content_area > div >.right .right.s_event {
    transition-delay: 1s;
}

#section2 .content_area > div >.right .right.s_event.active {
    transition-delay: 0.7s;
}

/* Ã¬â„¢Â¼Ã¬ÂªÂ½ -> Ã¬ËœÂ¤Ã«Â¥Â¸Ã¬ÂªÂ½ */
.pro_wrap .pro_list div.slick-slide h2 {
 font-size: 26px;
 font-weight: 600;
 margin-top: 25px;
}

.pro_wrap .pro_list div.slick-slide.slick-active h2 {
 color: #bb141a;
}



/*---------- swiper ----------*/
.swiper { width: 100%; height: 100%; overflow-y: scroll !important; -ms-overflow-style: none; touch-action: pan-y; } 

/* ÃƒÆ’Ã‚Â¬Ãƒâ€¦Ã‚Â Ãƒâ€šÃ‚Â¤ÃƒÆ’Ã‚Â­Ãƒâ€šÃ‚ÂÃƒâ€šÃ‚Â¬ÃƒÆ’Ã‚Â«Ãƒâ€šÃ‚Â¡Ãƒâ€šÃ‚Â¤ ÃƒÆ’Ã‚Â¬ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¢Ãƒâ€¹Ã¢â‚¬Â  ÃƒÆ’Ã‚Â«Ãƒâ€šÃ‚Â³Ãƒâ€šÃ‚Â´ÃƒÆ’Ã‚Â¬Ãƒâ€šÃ‚ÂÃƒâ€šÃ‚Â´ÃƒÆ’Ã‚ÂªÃƒâ€šÃ‚Â²Ãƒâ€¦Ã¢â‚¬â„¢ */
.swiper::-webkit-scrollbar { display: none; width: 0 !important; } 

.swiper-slide { font-size: 18px; /* Center slide text vertically */
 display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; /* display: flex; */
 display: block; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } 

.mySwiper .swiper-slide { overflow: hidden; position: relative; } 

.mySwiper .slide_bg { /* ÃƒÆ’Ã‚Â«Ãƒâ€šÃ‚ÂªÃƒâ€šÃ‚Â¨ÃƒÆ’Ã‚Â«Ãƒâ€šÃ‚Â°ÃƒÂ¢Ã¢â€šÂ¬Ã‚ÂÃƒÆ’Ã‚Â¬Ãƒâ€šÃ‚ÂÃƒâ€šÃ‚Â¼ÃƒÆ’Ã‚Â¬Ãƒâ€šÃ‚ÂÃƒâ€¹Ã…â€œ heightÃƒÆ’Ã‚Â«Ãƒâ€šÃ‚Â¥Ãƒâ€šÃ‚Â¼ ÃƒÆ’Ã‚Â¬Ãƒâ€¦Ã¢â‚¬Å“ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¾ÃƒÆ’Ã‚Â­ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¢Ãƒâ€šÃ‚Â¨ */
 width: 100%; height: 100vh; } 


/*---------- fullpage : scroll event ----------*/
/* fade out -> in */
.o_in.s_event { opacity: 0; transform: translateY(0%); transition: 2s; } 
.o_in.active { opacity: 1; transform: translateX(0%); transition: 2s; } 

/* down -> up */
.d_up.s_event { opacity: 0; transform: translateY(30%); transition: 0.5s; } 
.d_up.active { opacity: 1; transform: translateX(0%); transition: 0.5s; } 
/* -------------- */
#section3 .content_area > div .top h2.d_up.s_event, #section3 .content_area > div .top p.d_up.s_event { opacity: 0; transform: translateY(70%); transition: 0.5s; } 
#section3 .content_area > div .top p.d_up.s_event { transition-delay: .3s; } 
#section3 .content_area > div .top h2.d_up.s_event, #section3 .content_area > div .top p.d_up.active { opacity: 1; transform: translateX(0%); transition: 0.5s; } 
#section4 .content_area > div .top p.d_up.active { transition-delay: .4s; } 
#section4 .content_area > div .bottom p.d_up.active { transition-delay: .5s; } 


/* left -> right */
.l_right.s_event { opacity: 0; transform: translateX(-70%); transition: 0.7s; } 
.l_right.s_event.active { opacity: 1; transform: translateX(0%); transition: 0.7s; } 



/*---------- section1 ----------*/
/* section1 */
#section1 { } 
#section1 .mySwiper .swiper-slide { } 
#section1 .mySwiper .swiper-slide .slide_bg { height: 100vh; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; } 
#section1 .mySwiper .swiper-slide .visual_wrap {position: absolute;top: calc(375px + 80px);left: 0;right: 0;width: 100%;max-width: 1460px;margin: 0 auto;} 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box {} 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box { font-family: 'Oxanium', sans-serif; color: #fff; } 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box span {display: inline-block;font-size: 36px;font-weight: 300;padding-bottom: 55px;} 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box span br {display: none;}
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 {font-size: 72px;font-weight: 600; letter-spacing: -2px} 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 span { display: block; font-size: 142px; } 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 span:not(.white) { text-indent: 130px; } 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 span.white { position: relative; color: rgb(255 255 255 / 70%); } 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 span.white:before { content:""; display: block; position: absolute; top: -80px; left: 6px; background: url(../img/main1_1.png) no-repeat; background-size: contain; width: 100%; max-width: 310px; height: 232px; } 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 span.transparent { -webkit-text-stroke: 1px #fff; font-weight: 500; color: transparent; font-size: 110px; } 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info {padding-top: 30px;} 
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info p { font-size: 30px; font-weight: 300; color: #fff; line-height: 1.4; } 

#section1 .mySwiper .swiper-slide .slider_1 { background-image: url(../img/main_visual1.jpg); } 
#section1 .mySwiper .swiper-slide .slider_2 { background-image: url(../img/main_visual2.jpg); } 
#section1 .mySwiper .swiper-slide .slider_3 { background-image: url(../img/main_visual3.jpg); } 
#section1 .mySwiper .swiper-slide.swiper-slide-active .slide_bg { animation: zoom_in 5000ms; transition: transform 5000ms ease-in-out, opacity 1000ms ease 0s; } 
#section1 .mySwiper .swiper-slide.swiper-slide-active .visual_wrap .visual_txt_box .title_box h2 { animation: t_top 1000ms; transition: transform 1000ms ease-in-out, opacity 1000ms ease 0s; animation-delay: 0.2} 
#section1 .mySwiper .swiper-slide.swiper-slide-active .visual_wrap .visual_txt_box .visual_info { animation: t_top 1000ms; transition: transform 1000ms ease-in-out, opacity 1000ms ease 0s; animation-delay: 0.4s } 
@keyframes zoom_in {
0% { transform: scale(1.2); } 
100% { transform: scale(1) rotate(0.003deg); } 
}
@keyframes t_top { 
0% {opacity: 0; transform: translateY(100px);} 
100% {opacity: 1; transform: translateY(0%);} 
}

/* ë¡œë”©ë°” ì• ë‹ˆë©”ì´ì…˜ */
@-webkit-keyframes LoadingBar { 
from { width:0px; } 
to { width:80px; } 
}
@keyframes LoadingBar { 
from { width:0px; } 
to { width:80px; } 
}

/* pagnation */
.control_wrap {position: absolute;bottom: 7.5%;left: 0;right: 0;max-width: 1830px;width: 100%;z-index: 1;margin: 0 auto;}  
.control_wrap .swiper-pagination {text-align: right;position: relative;top: 0;} 
.control_wrap .swiper-pagination-bullet {position: relative;width: 80px;font-family: 'Play', sans-serif;color: rgb(255 255 255 / 70%);font-size: 15px;font-weight: 600;text-align: center;opacity: 1;margin-left: 1% !important;}
.control_wrap .swiper-pagination-bullet:before {content:"";display: block;position: absolute;top: 25px;left: 0;width: 100%;height: 6px;border: 1px solid rgb(255 255 255 / 70%);}
.control_wrap .swiper-pagination-bullet::after {content:"";display: block;width: 80px;height: 6px;opacity: 1;position: absolute;left: 0;top: 25px;} 
.control_wrap .swiper-pagination-bullet {background: var(--swiper-pagination-bullet-inactive-color,none) !important;}
.control_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active {color: #bb141a;}
.control_wrap .swiper-pagination-bullet.swiper-pagination-bullet-active:after {animation:LoadingBar 5s both;animation-delay: 0.3s;background: #bb141a;} 
:root {--swiper-theme-color: none !important;}


/* mouse wheel */
#section1 .mouse_scroll {position: absolute;left: 45px;bottom: 7.5%;transform: translateX(-50%);z-index:101;color: #fff;text-align: center;animation: mouse_ani 1.3s ease-in-out infinite;}
#section1 .mouse_scroll span {font-size: 15px;font-family: 'Roboto', sans-serif; display:block;transform: rotate(270deg);}
#section1 .mouse_scroll i {font-size: 20px;padding-top: 35px;}
/* mouse_ani */
@keyframes mouse_ani {
0% {bottom: 60px;}
50% {bottom: 50px;}
100% {bottom: 60px;}
}


/*---------- section2 ----------*/
#section2 {background: #fafafa;}
#section2.section .content_area {max-width: 100%;padding-top: 260px;}
#section2.section:before {content:"";display: block;position: absolute;top: 0;right: 0;width: 100%;max-width: 960px;height: 100%;background: url(../img/main2.png) no-repeat center / cover;}
#section2 .txt, #section2 .pro_btns {max-width: 1460px;margin: 0 auto;}
/* pro_btns */
.pro_btns > div, .pro_btns span {display: inline-block;vertical-align: middle;}
.pro_btns .pro_btn1 .pro_dot {display: inline-block;width: auto;}
.pro_btns i {font-size: 18px;} 
.pro_btns .pro_btn2 span {width: 30px;height: 30px;border: 1px solid #111;border-radius: 50%;} 
.pro_btns .pro_btn2 span i {position: absolute;top: calc(50% - 9px);left: calc(50% - 9px);} 
.pro_btns .pro_btn2 span.play i {left: calc(50% - 7px);} 
.pro_btns {position: relative;right: 0;top: -35px;cursor: pointer;text-align: right;} 
.pro_btns button {border: none;background: none;} 
.pro_btns .pro_btn2 {margin-left: 10px;} 
.pro_btns .pro_btn2 span {position: relative;display: none;} 
.pro_btns .pro_btn2 span.on {display: inline-block;} 
/**/
.pro_wrap {padding-top: 10px;max-width: 1690px;float: right;}
.pro_wrap .pro_list {width: auto;height: 100%;margin:0 auto;z-index:10;overflow: hidden;left: 0;padding-bottom: 55px;}
.pro_wrap .pro_list div {position:relative;}
.pro_wrap .pro_list div div {box-shadow: 6px 6px 12px #bfbfbf;}
.pro_wrap .pro_list div div.slick-slide.slick-current.slick-active {border: 2px solid #ef4036;}
.pro_wrap .pro_list div div.slick-slide.slick-current.slick-active:after {opacity: 0;}
.pro_wrap .pro_list div div a {position: relative;display: block;width: 100%;height: 100%;}
.pro_wrap .pro_list div div a img {display: block;width: 100%;height: 100%;object-fit: contain;}
.pro_wrap .slick-slide{width: 450px !important;height: 305px;margin: 0 25px;background: #fff;}

/* slick orgin */
.slick-slider{position: relative;display: block; box-sizing: border-box;
-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y;
touch-action: pan-y;-webkit-tap-highlight-color: transparent;	}
.slick-list{display: block;margin:0;padding:0;width:100%;height: 100%;}
.slick-slide{float: left;}
.slick-initialized .slick-slide{display: block;}
/**/
.slick-dots li:not(.slick-active) {display: none;}
.slick-dots li a{font-size: 14px;color: #565356;font-weight: bold;}
.slick-dots li a:first-child{color: #282525;margin-right: 60px;}

.progress {position: absolute;top: calc(50% - 1px);right: 92px;display: inline-block;width: 50px;height: 2px; /* border-radius: 10px; */
overflow: hidden;background-color: #928f8e;background-image: linear-gradient(to right, black, black);background-repeat: no-repeat;background-size: 0 100%;transition: background-size .4s ease-in-out;}



/*---------- section3 ----------*/
#section3.section:before {content:"";display: block;position: absolute;bottom: 0;left: 0;background: url(../img/main3.png) no-repeat center / cover;width: 100%;max-width: 1920px;height: 429px;z-index: -1;}
#section3.section .content_area {padding-top: 250px;}
/**/
#section3.section .content_area .txt, #section4.section .content_area .txt {margin-top: 40px;}
#section3.section .content_area .txt {width: calc(100% - 58%);margin-right: 5%;}
#section3.section .content_area .txt h2 {font-family: inherit;font-size: 60px;color: #111;font-weight: 300;line-height: 1.2;margin-bottom: 40px;}
#section3.section .content_area .txt h2 font {color: #ef4036; font-weight: 600;}
/**/
#section3.section .content_area .img img {display: block;width: 100%;max-width: 910px;}


/*---------- section4 ----------*/
#section4.section:before {content:"";display: block;position: absolute;top: 0;right: 0;background: url(../img/main4.png) no-repeat;background-size: cover;width: 100%;max-width: 1248px;height: 432px;z-index: -1;}
#section4.section:after {content:"";display: block;position: absolute;bottom: 0;left: 0;background: url(../img/main4_1.png) no-repeat;background-size: cover;width: 100%;max-width: 1427px;height: 496px;z-index: -2;}
#section4.section .content_area {padding-top: 210px;}
/**/
#section4.section .content_area .txt {
    width: calc(100% - 76%);
    margin-right: 5%;
}
/**/
#section4.section .content_area .img {
    width: 71%;
}
#section4.section .content_area .img div{width: 100%;max-width: 490px;height: 340px;transition: all .3s;box-shadow: 0px 12px 20px #bfbfbf;}
#section4.section .content_area .img a{display: block;width: 100%;height: 100%;padding: 50px 0 0 45px;color: #fff;z-index: 1;}
#section4.section .content_area .img a h3{font-size: 30px;margin-bottom: 30px;}
#section4.section .content_area .img a p{font-size: 20px;font-weight: 100;}
#section4.section .content_area .img a {position: relative;}
#section4.section .content_area .img a:before{content:"";display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgb(0 0 0 / 30%);opacity: 0;z-index: -1;transition: all .3s;}
#section4.section .content_area .img .left{margin-right: 45px;margin-top: 207px;background: url('/img/main4_2.png') no-repeat center / cover;border-radius: 20px;}
#section4.section .content_area .img .left a:before{border-radius: 20px;}
#section4.section .content_area .img .right{background: url('/img/main4_3.png') no-repeat center / cover;}
/* hover */
#section4.section .content_area .img div:hover a:before {opacity: 1;}
#section4.section .content_area .img div:hover, #section4.section .content_area .img div:hover a:before{border-radius: 50px; transition: all .3s;}
#section4.section .content_area .img div:hover a h3 {color: #ef4036; transition: all .3s;}




/* respon */
@media all and (max-width: 1830px){ /* width */
/* section1 */
.control_wrap {width: 96%;}
#section1 .mouse_scroll {left: calc(2% + 17px / 2);}
}
@media (max-width: 1690px){ /* width */
/* section2 */
.pro_wrap {width: calc(96% + 25px);}
}
@media (max-width: 1460px){ /* width */
/* common */
.section .content_area, footer .content_area {width: 96%;}
    
/* section1 */
#section1 .mySwiper .swiper-slide .visual_wrap {top: calc(375px + 70px);width: 96%;}

/* section2 */
#section2.section:before {right: -400px;}
#section2 .txt, #section2 .pro_btns {width: 96%;}

/* section3 */
#section3.section .content_area .txt {width: calc(100% - 55%);}
#section3.section .content_area .txt h2 {font-size: 48px;}

/* section4 */
#section4.section .content_area .txt {width: calc(100% - 72%);}
#section4.section .content_area .img a {padding: 50px 0 0 25px;}
}
@media (max-width: 1300px){
/* common */
.right_btn {top: 170px;}
}

@media (max-width: 1023px){
/* common */
div#fullpage > div, .fp-tableCell {height: auto !important;}
.right_btn {top: 90px;}
.section .content_area .txt h2, #section3.section .content_area .txt h2 {font-size: 43px;}

/* section1 */
#section1 .mySwiper .swiper-slide .visual_wrap {top: 45%;}
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 {font-size: 62px;}
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info p {font-size: 26px;}

/* section2 */
#section2.section .content_area {padding-top: 160px;}
#section2.section:before {right: -350px;}
.pro_wrap {width: calc(96% + 15px);}
.pro_wrap .pro_list {padding-bottom: calc(160px + 24px);}
.pro_wrap .slick-slide{width: 350px !important;height: 250px;margin: 0 15px;}
.pro_wrap .pro_list div.slick-slide h2 {font-size: 24px;}

/* section3 */
#section3.section .content_area, #section4.section .content_area  {flex-direction: column;padding: 160px 0;}
#section3.section .content_area .txt, #section4.section .content_area .txt {width: 100%;margin: 0 0 45px 0;}
#section3.section .content_area .txt h2 {margin-bottom: 20px;}
#section3.section .content_area .txt h2 br:nth-last-of-type(1),
#section3.section .content_area .txt > p br:nth-last-of-type(1), #section3.section .content_area .txt > p br:nth-last-of-type(3){display: none;}
#section3.section .content_area .img img {max-width: 100%;}

/* section4 */
#section4.section .content_area .txt > p br:nth-last-of-type(1) {display: none;}
#section4.section .content_area .img {width: 100%;}
#section4.section .content_area .img div {max-width: 50%;height: 290px;}
#section4.section .content_area .img .left {margin-right: 35px;}
#section4.section .content_area .img a h3 {font-size: 28px;}
}

@media all and (max-width: 767px){
/* common */
.more {width: 150px;height: 50px;}
.more a {padding: 16px 20px;}
.section .content_area .txt h2, #section3.section .content_area .txt h2 {font-size: 33px;margin-bottom: 10px;}
.section .content_area .txt > p {font-size: 18px;}

/* section1 */
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 {font-size: 52px;}
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info {padding-top: 20px;}
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info p {font-size: 22px;}
.control_wrap .swiper-pagination-bullet, #section1 .mouse_scroll span {font-size: 14px;}

/* section2 */
#section2.section:before {right: -300px;}
#section2.section .content_area {padding-top: 100px;}
.pro_btns {top: 20px;}
.pro_wrap {width: calc(96% + 10px);padding-top: 35px;}
.pro_wrap .pro_list {padding-bottom: calc(100px + 22px);}
.pro_wrap .slick-slide{width: 250px !important;height: 150px;margin: 0 10px;}
.pro_wrap .pro_list div.slick-slide h2 {font-size: 22px;margin-top: 15px;}

/* section3 */
#section3.section .content_area, #section4.section .content_area {padding: 100px 0;}
#section3.section .content_area .txt, #section4.section .content_area .txt {margin: 0 0 35px 0;}
#section3.section .content_area .txt > p br:nth-last-of-type(3) {display: block;}
#section3.section .content_area .txt > p br:nth-last-of-type(2) {display: none;}

/* section4 */
#section4.section .content_area .img div {height: 240px;border-radius: 20px;}
#section4.section .content_area .img .left {margin-top: 0;margin-right: 25px;}
#section4.section .content_area .img a {padding: 40px 25px 0;}
#section4.section .content_area .img a h3 {font-size: 26px;margin-bottom: 20px;}
#section4.section .content_area .img a p {font-size: 18px;}
#section4.section .content_area .img a p br {display: none;}
}
@media all and (max-width: 600px){
/* common */
.right_btn button p {width: 42px;height: 42px;}
.right_btn button p i {vertical-align: bottom;}
}
@media all and (max-width: 520px){
/* section3 */
#section3.section .content_area .txt > p br {display: none;}
}

@media (max-width: 479px){
/* common */
.right_btn {top: 100px;z-index: 1000;}
.right_btn button {padding: 0 0 0 10px;}
.right_btn button span {display: none;}
.section .content_area .txt h2, #section3.section .content_area .txt h2 {font-size: 28px;}
.section .content_area .txt > p {font-size: 16px;}

/* section1 */
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .title_box h2 {font-size: 42px;}
#section1 .mySwiper .swiper-slide .visual_wrap .visual_txt_box .visual_info p {font-size: 18px;}

/* section2 */
#section2.section:before {right: -250px;}
.pro_btns {top: 20px;}
.pro_wrap {width: calc(96% + 10px);padding-top: 30px;}
.pro_wrap .pro_list {padding-bottom: calc(100px + 20px);}
.pro_wrap .slick-slide{width: 250px !important;height: 150px;margin: 0 10px;}
.pro_wrap .pro_list div.slick-slide h2 {font-size: 20px;}

/* section3 */
#section3.section .content_area .txt {margin: 0 0 30px 0;}

/* section4 */
#section4.section .content_area .img {flex-direction: column;}
#section4.section .content_area .img div {max-width: 100%;height: 190px;border-radius: 10px;}
#section4.section .content_area .img .left {margin-bottom: 25px;border-radius: 10px;}
#section4.section .content_area .img a h3 {font-size: 24px;}
#section4.section .content_area .img a p {font-size: 16px;}
#section4.section .content_area .img a p br {display: block;}
#section4.section .content_area .img div:hover, #section4.section .content_area .img div:hover a:before{border-radius: 40px;}
}