@charset "utf-8";

/* 
 * main CSS Document
 * KOWEB
 */

::-webkit-scrollbar{width:7px; height:4px;}
::-webkit-scrollbar-thumb{background:#3bcac9;}
::-webkit-scrollbar-track{background:#f1f1f1;}

#fullpage .section:not(#section0){background:url(../images/main/img_inrBg.jpg) repeat 50% 50%;}
#fullpage .section:not(#section0):after{content:""; position:absolute; top:0; left:0; z-index:9; width:203px; height:100%; background:#fff;}

.tit_main h3{float:left; line-height:1; font-weight:800; font-size:45px; color:#222;}
.tit_main h4{float:left; line-height:2; font-weight:300; font-size:22px; color:#222;}
.tit_main h4 em{font-weight:600;}
.tit_main a{position:relative; float:right; overflow:hidden; width:40px; height:40px; margin-top:3px; border:1px solid #222; font-size:14px; color:#222; transition:all 0.4s ease-out 0s;}
.tit_main{overflow:hidden;}
.tit_main a span{display:block; position:relative; float:left; width:11px; height:1px; margin:19px 0px 0 14px; background:#000;}
.tit_main a:hover span{margin:19px 0px 0 21px;}
.tit_main a span:after{content:""; position:absolute; top:-5px; left:5px; width:1px; height:11px; background:#000;}
.tit_main a i{display:inline-block; position:absolute; transition:all 0.4s ease-out 0s; transform:translate3d(100%,10px,1px); -webkit-transform:translate3d(100%,10px,1px);}
.tit_main a:hover i{transform:translate3d(31px,10px,1px); -webkit-transform:translate3d(31px,10px,1px);}
.tit_main a:hover{width:120px;}

.btn_nextSection{position:absolute; bottom:0; left:200px; width:70px; height:70px; background:#fff;}
.btn_nextSection img{display:block; width:12px; height:6px; margin:32px auto;}

.spam > span{display:inline-block;height: 43px;line-height: 43px;box-sizing:border-box;padding: 0 15px;margin-right: 9px;background: #fff;color: #3eb2d6;letter-spacing:3px;font-size:0.9rem;font-weight: 700;}
.spam > *{vertical-align:middle;}
.spam > *{
    float: left;
    margin-top: 0 !important;
}
.area_input ul{overflow:hidden;}
.spam{margin-top:20px;}
.spam > input {
    width: -webkit-calc(100% - 88px) !important;
    width: calc(100% - 88px) !important;
}

/* main */
.area_visual{position:relative; width:100%;}
.area_visual .bxslider li{z-index:1 !important; height:100%; background-size:cover; background-position:50% 0; color:#fff; background-repeat:no-repeat;}
.area_visual .bxslider li > div{margin-top:350px;}
.area_visual .bxslider li h2{font-weight:400; font-size:80px; text-transform:uppercase;}
.area_visual .bxslider li h2 em{display:inline-block; margin-left:16px; font-weight:800;}
.area_visual .bxslider li p{margin-top:13px; font-weight:200;}
.area_visual .bxslider li p i{font-weight:400; color:#3ca1d9;}
.area_visual .bx-controls.section_left.bx-has-controls-direction.bx-has-pager{position:relative;}
.area_visual .bx-controls-direction{position:absolute; right:40px; bottom:35px; z-index:99999;}
.area_visual .bx-controls-direction a{display:inline-block; position:absolute; right:0; bottom:0; width:7px; height:12px; background:#ccc; text-indent:-9999px; transition:all 0.3s ease-out 0s;}
.area_visual .bx-controls-direction .bx-prev{opacity:0.4; right:214px; bottom:2px; background:url(../images/main/icon_arr01.svg) no-repeat 50% 50%;}
.area_visual .bx-controls-direction .bx-next{background:url(../images/main/icon_arr01.svg) no-repeat 50% 50%; transform:rotate(180deg);}
.total.section_left{position:relative;}
.total.section_left > *{position:absolute; right:84px; bottom:35px; z-index:9999; font-size:14px; color:#444;}
.total.section_left > em{right:200px; font-weight:700;}
.bx-pager.bx-default-pager{position:absolute; right:118px; bottom:42px; z-index:99999; width:66px; height:1px; background:#ccc; text-indent:-9999px;}
.bx-pager-item a{display:inline-block; position:absolute; left:0; z-index:999; width:100%; height:1px; transition:all 0.3s ease-out 0s;}
.bx-pager-item{position:relative; float:left; width:33.3333%; height:1px;}
.bx-pager-item a.active{background:#000;}
.area_visualBottom{position:absolute; bottom:0; left:0; z-index:99; width:100%; border-top:1px solid rgba(255,255,255,0.15);}
.area_visualBottom:after{content:""; position:absolute; right:0; bottom:0; width:300px; height:100%; background:#fff;}

.list_notice{padding:35px 0;}
.list_notice p{display:inline-block;}
.list_notice > a{color:#fff;}
.list_notice > a p{font-weight:300; font-size:15px;}
.list_notice > a span{display:inline-block;position:absolute;opacity:0.5;top:50%;right:330px;margin: -10px 0 0 0;font-weight:200;font-size:14px;}
.inr_padding{padding-left:340px !important;}
.inr_fullpage{width:calc(100% - 570px);}
.box_customer{display:table; position:absolute; top:0; right:0; z-index:1; width:570px; height:100%; background-image:linear-gradient(110deg, #3ca1d9, #41cfcf);}
.box_customer .inr a img{display:inline-block; height:40px;}
.box_customer .inr{display:table-cell; padding-left:90px; vertical-align:middle;}
.box_customer .inr > em{display:block; line-height:1.3; margin-left:-0.025em; font-weight:100; font-size:45px; color:#fff; letter-spacing:-0.025em;}
.box_customer .inr > i{display:block; margin-bottom:5px; font-weight:300; color:rgba(255,255,255,0.5);}
.box_customer > em{position:absolute; right:50px; bottom:50px; color:#fff;}
.box_customer > em a{font-weight:600; font-size:24px; color:#fff;}
.box_customer > em i{display:block; font-weight:300; font-size:14px; color:rgba(255,255,255,0.5);}
.area_svg{position:absolute; overflow:hidden; top:250px; left:310px; z-index:9999; width:985px; height:200px; background-size:cover;}
.area_svg svg{position:absolute; left:4px; z-index:999; height:200px;}
.area_svg svg path{stroke:rgba(255,255,255,0.3); stroke-width:1px; stroke-miterlimit:10; fill:none;}
.cls-1,
.cls-2,
.cls-3,
.cls-4,
.cls-5,
.cls-6,
.cls-7,
.cls-8{animation:offset linear infinite;}
.cls-1{stroke-dasharray:1020px; stroke-dashoffset:1020px; animation-duration:20s;}
.cls-2{stroke-dasharray:1020px; stroke-dashoffset:1020px; animation-duration:20s;}
.cls-3{stroke-dasharray:2000px; stroke-dashoffset:2000px; animation-duration:20s;}
.cls-4{stroke-dasharray:2000px; stroke-dashoffset:2000px; animation-duration:20s;}
.cls-5{stroke-dasharray:4000px; stroke-dashoffset:4000px; animation-duration:20s;}
.cls-6{stroke-dasharray:6000px; stroke-dashoffset:6000px; animation-duration:20s;}

.circle{opacity:0.3; width:100%; height:auto; fill:none; stroke:#fff; stroke-width:3px;}
.circle_gauge svg{position:absolute; top:0; left:0;}
.circle_gauge svg:nth-child(1){transform:scaleX(-1); transform-origin:50% 50%;}
.circle_gauge svg path{opacity:0.7; transition:all 0.3s ease-out 0s; fill:none; stroke:#FFF; stroke-width:3px; stroke-dashoffset:49.1176; stroke-dasharray:70.168px, 80.168px;}
.btn_more{position:relative;float:left;margin-top: 30px;}
.circle_gauge{display:block; position:absolute; top:0; left:0; width:40px; height:40px;}
.circle_base{display:block; position:absolute; top:0; left:0; height:100%;}

.btn_more a{display:inline-block; margin-right:20px;}
.btn_more a i{float:left;margin:10px 14px 0 0;font-weight:600;font-size: 15px;color:#fff;}
.box_customer .btn_more .circle_gauge + img{display:block; position:absolute; top:14px; left:17px; height:11px;}
.circle_area{float:left; position:relative; width:40px;}
.btn_more a:hover .circle_gauge svg path{stroke-dashoffset:1.1176;}

.fp-viewing-1Page #txtCustomer:not(.txtCustomer01){display:none;}
.fp-viewing-2Page #txtCustomer:not(.txtCustomer02){display:none;}
.fp-viewing-3Page #txtCustomer:not(.txtCustomer03){display:none;}
.fp-viewing-4Page #txtCustomer:not(.txtCustomer04){display:none;}
.fp-viewing-4 #txtCustomer:not(.txtCustomer04){display:none;}

/* 회사소개 */
.area_about,
.area_customer{margin-right:80px;}
.area_about .tit_main{margin-bottom:72px;}
.area_about ul li{position:relative; float:left; margin-bottom:30px;}
.area_about ul li i{position:absolute;top:20px;left:-13px;padding:8px 14px;font-weight:300;font-size:15px;color:#fff;background-image:linear-gradient(110deg, #3ca1d9, #41cfcf);}
.area_about ul li:nth-child(2n){margin-left:43px;}
.area_about ul li:nth-child(3),
.area_about ul li:nth-child(4){margin-bottom:0;}
.area_about ul + em{display:block; float:left; width:100%; margin-top:51px; font-weight:200; font-size:35px; color:#222;}
.area_about ul + em + p{float:left; width:100%; margin-top:8px; font-weight:300; color:#666;}
.area_about ul + em + p b{font-weight: 600;color:#000;}

/* 포트폴리오 */
.area_portfolio .tit_main{margin-bottom:58px;}
.area_portfolio .tit_main a{margin-right:80px;}
.inr_portfolio{background:#fff;}
.inr_portfolio .text{position:relative; padding:40px;}
.inr_portfolio .text em{display:block; margin-top:10px; font-weight:300; font-size:19px; color:#222;}
.inr_portfolio .text a{display:block;}
.inr_portfolio .text i{font-weight:300; font-size:14px; color:#bbb; transition:all 0.4s ease-out 0s;}
.inr_portfolio .text span{display:block; margin-top:85px; font-weight:700; font-size:14px; color:#222;}
.inr_portfolio:after{content:""; position:absolute; opacity:0; bottom:-66px; left:0; z-index:-1; width:100%; height:100px; background:url(../images/main/img_portfolio04.png) no-repeat 50% 50%; transition:all 0.7s ease-out 0s;}
.inr_portfolio:hover:after{opacity:1;}
.inr_portfolio .text:after{content:""; position:absolute; bottom:47px; left:0; width:0; height:1px; background:#3bcac9; transition:all 0.4s ease-out 0s;}
.swiper-slide:hover  .text i{color:#3bcac9;}
.inr_portfolio:hover  .text:after{width:120px;}
.swiper-button-next:before{content:""; position:absolute; top:12px; left:-11px; width:1px; height:20px; background:#ccc;}
.swiper-button-next:hover,
.swiper-button-prev:hover{opacity:1;}


/* 고객센터 */
.area_order ul li{float:left; width:298px; margin:0 18px 18px 0; background:#fff;}
.area_order ul{overflow:hidden;}
.area_order ul li .inr_order{position:relative; padding:25px;}
.area_order ul li .inr_order em{font-weight:300; font-size:14px; color:#ccc;}
.area_order ul li .inr_order p{overflow:hidden; margin-top:5px; font-size:15px; color:#222; white-space:nowrap; text-overflow:ellipsis;}
.area_order ul li .inr_order i{display:block; margin-top:24px; font-weight:200; font-size:13px; color:#bbb; text-align:right;}
.area_order ul li:nth-child(3n){margin-right:0;}
.area_order ul li .inr_order span{position:absolute; top:0; right:0; width:26px; height:26px; line-height:26px; background:#3bcac9; font-weight:600; font-size:13px; color:#fff; text-align:center;}
.area_order ul li .inr_order:after{content:""; position:absolute; bottom:0; left:0; width:0; height:2px; background:#3bcac9; transition:all 0.4s ease-out 0s;}
.area_order ul li:hover .inr_order:after{width:100%;}
.area_customer .tit_main{margin-bottom:17px;}
.area_inquiry{overflow:hidden; margin-top:19px;}
.area_inquiry > div:not(.tit_main){float:left;}
.area_list{width:613px; background:#fff;}
.area_list > div{height:300px;margin:40px 30px;}
.area_list ul li span{display:inline-block; margin:8px 0 0 8px; font-size:12px; color:#3bcac9; text-transform:uppercase;}
.area_contact > div > div{padding:35px 30px;}
.area_contact{width:298px; margin-left:19px; background:url(../images/main/img_contact01.jpg) no-repeat 50% 50%;}
.box_call h5{font-weight:800; font-size:25px; text-transform:capitalize;}
.box_call{color:#fff;}
.box_call h5 i{display:block; font-weight:200; font-size:14px;}
.box_call a{line-height:1; font-size:35px; color:#fff;}
.box_call em{display:block; margin-top:22px;}
.box_call em i{display:inline-block; margin-left:5px; font-weight:100;}
.box_contact span{display:inline-block; padding:5px 10px; background:#fff; font-size:13px; color:#77bde1; border-radius:100px;}
.box_contact{background:rgba(255,255,255,0.2); color:#fff;}
.box_contact p{font-weight:300; font-size:17px;}
.box_contact p b{display:inline-block; margin:7px 3px 0 0; font-weight:600;}
.box_contact p b:last-child{margin-left:4px;}
.box_contact i{display:block; line-height:1.4; margin-top:22px; font-weight:100; font-size:14px;}
.area_list ul li em{float:left; padding:7px 10px; background:#4f4f4f; font-weight:200; font-size:13px; color:#fff;}
.area_list ul li i{float:right; line-height:2.5; font-weight:300; font-size:13px; color:#bbb;}
.area_list ul li{overflow:hidden; border-bottom:1px solid #eee;}
.area_list ul li:last-child{border-bottom:0;}
.area_list ul{}
.area_list ul li p{float:left; line-height:1.9; margin-left:17px; font-size:15px;}
.area_list ul li a{display:block;overflow:hidden;padding: 28px 0;}
.area_list ul li:first-child a{padding-top:0;}
#section4{overflow: visible;}

.area_input{overflow:hidden;margin: 60px 90px 0 0;font-size:14px;}
.area_input input{display:block;width:100%;height:43px;background:rgba(255,255,255,0.2);border:none;color:#fff;outline: none;transition: all 0.4s ease-out 0s;}
.area_input ul li{float:left;width:50%;transition: all 0.4s ease-out 0s;}
.area_input ul li:last-child{width:100%; margin-top:6px;}
.area_input ul li:first-child{width:-webkit-calc(33% - 8px); width:calc(50% - 10px); margin-right:10px;}
.area_input input:focus{background:rgba(255,255,255,0.4); transition:all 0.4s ease-out 0s;}

::placeholder{opacity:0.6; color:#fff;font-weight: 100}
:-ms-input-placeholder{color:#fff;}
::-ms-input-placeholder{color:#fff;}

.btn_kakaoch{display:block; position:absolute; padding:10px 20px; bottom:50px; font-weight:500; color:#fff !important; border:1px solid #fff; box-sizing:border-box; transition:0.3s;}
.btn_kakaoch img{margin-right:5px; width:26px; height:auto !important;}
.btn_kakaoch:hover{background:rgba(255, 255, 255, 0.2);}

@keyframes offset {
  to {
    stroke-dashoffset: 0px;
  }
}

@media all and (max-width:1919px){
	#fullpage .section:not(#section0):after{width:165px;}
	.inr_padding{padding-left:260px !important;}
	.inr_fullpage{width:calc(100% - 490px);}
	
	.list_notice > a span{margin:-10px 0 0 0;}
	.area_visual .bxslider li h2{font-size:75px;}
	.area_svg{top:250px; left:240px; width:814px; height:165px;}
	.area_svg svg{height:165px;}	
	.box_customer{width:490px;}
	.btn_nextSection{left:164px;}
	.area_about ul li{width:-webkit-calc(48% - 7px); width:calc(48% - 7px);}
	.area_about ul li img{width:100%;}
	.swiper-container{overflow:visible;}
	.area_order ul li{width:-webkit-calc(33% - 4px); width:calc(33% - 4px); margin:0 9px 9px 0;}
	.area_order ul li .inr_order{padding:19px;}
	.area_list{width:-webkit-calc(100% - 317px); width:calc(100% - 317px);}
	.area_list > div{height: 301px;margin: 40px 30px;}
	.area_list ul li i{display:none;}
	.area_list ul li a{padding:27px 0;}
	.area_list ul{}

	.area_list ul li a{padding: 27px 0;}
}

@media all and (max-width:1580px){
	.inr_fullpage{width:calc(100% - 440px);}
	.inr_padding{padding-left:220px !important;}
	
	.list_notice{padding:28px 0;}
	.list_notice > a p,
	.list_notice > a span{opacity:0;}

	.scroll_down{bottom:18px;}
	.area_visual .bx-controls-direction{right:29px; bottom:29px;}
	.bx-pager.bx-default-pager{right:99px; bottom:35px; width:56px;}
	.total.section_left > *{right:69px; bottom:28px; font-size:14px;}
	.total.section_left > em{right:170px;}
	.area_visualBottom:after{width:250px;}
	.area_visual .bx-controls-direction .bx-prev{right:184px;}

	.area_svg{left:190px;}
	.box_customer{width:440px;}
	.box_customer .inr > em{font-size:40px;}
	.box_customer .inr{padding-left:60px;}
	.tit_main h3{font-size:38px;}
	
	.area_about .tit_main{margin-bottom:62px;}
	.area_about,
	.area_customer{margin-right:50px;}
	.area_about ul li{width:-webkit-calc(48% - 2px); width:calc(48% - 2px);}
	.area_about ul li i{top:15px; font-size:14px;}
	.area_about ul li:nth-child(2n){margin-left:28px;}
	.area_contact{width:258px; margin-left:15px; background:url(../images/main/img_contact01.jpg) no-repeat 50% 50%;}
	.area_contact > div > div{padding:25px 20px;}
	.area_portfolio .tit_main a{margin-right: 50px;}

	.box_call a{font-size:27px;}
	.box_call h5{font-size:23px;}
	
	.area_list{width:-webkit-calc(100% - 273px); width:calc(100% - 273px);}
	.area_list ul{margin-right:19px;}
	.area_list ul li p{line-height:2.2; margin-left:12px; font-size:14px;}
	.area_list ul li a{padding: 23px 0;}
	.area_list > div{height:268px; margin:30px 20px;}
	.area_order ul li .inr_order{padding:15px;}
}

@media all and (max-width:1380px){
	.inr_fullpage{width:calc(100% - 360px);}
	.area_visual .bxslider li h2{font-size:62px;}
	.area_svg svg{height:145px;}
	.area_svg{left:190px; width:715px; height:145px;}
	.box_customer{width:360px;}
	.box_customer .inr > em{font-size:35px;}
	.btn_more{margin-right:90px;}
	.btn_more a{position:relative; width:100%; margin:5px 0;}
	.circle_area{float:none; position:absolute; right:0px; top:0px;}
    
    .btn_kakaoch{padding:8px 34px; left:146px; bottom:110px;}
}

@media all and (max-width:1280px){
	#fullpage .section:not(#section0):after{width:138px;}
	.inr_padding{padding-left:180px !important;}
	.area_visual .bxslider li h2{font-size:56px;}
	.area_svg{top:292px; left:165px; width:543px; height:110px;}
	.area_svg svg{height:110px;}
	
	.area_about ul li{width:-webkit-calc(48% - 2px); width:calc(48% - 2px);}
	.area_about ul li i{top:11px; font-size:13px;}
	.area_about ul li:nth-child(2n){margin-left:24px;}	
	.btn_nextSection{left:124px;}
	
	.area_order ul li{width:-webkit-calc(50% - 5px); width:calc(50% - 5px); margin:0 9px 9px 0;}
	.area_order ul li:nth-child(2n){margin-right:0 !important;}
	.area_order ul li:nth-child(3n){margin-right:10px;}
	.area_contact{display:none;}
	.area_list{width:100%;}
	.area_order ul li:nth-child(5),
	.area_order ul li:nth-child(6){display:none;}
	.area_list > div{height: 183px;}
}

@media all and (max-width:1110px){
	#fp-nav{display:none !important;}
	#fullpage .section:not(#section0):after{display:none;}
	.inr_padding{padding-left:30px !important;}
	.inr_fullpage{width:100%;}

	.box_customer .inr > i{font-size:15px;}
	.box_customer{display:none; position:fixed;}
	.area_visual .bxslider li{background-position:20% 0px;}
	.box_customer{display:none;}
	.area_visual .bxslider li h2{font-size:60px;}
	.area_svg svg{height:130px;}
	.area_svg{top:290px; left:20px; width:641px; height:130px;}	
	
	.area_about ul li{width:-webkit-calc(48% - -2px); width:calc(48% - -2px);}
	.area_about,
	.area_customer{margin-right:0;}
	.area_about,
	.area_customer{margin-right:30px;}
	.area_about.inr_padding{padding-left:30px !important;}
	.area_about .tit_main{margin-bottom:40px;}
	.btn_nextSection{display:none;}
	.area_about ul li{margin-bottom:22px;}
	
	.inr_portfolio .text{padding:23px;}
	.inr_portfolio .text em{overflow:hidden; margin-top:5px; font-size:17px; white-space:nowrap; text-overflow:ellipsis;}
	.inr_portfolio .text i{font-size:13px;}
	.inr_portfolio .text span{margin-top:65px; font-size:12px;}
	.inr_portfolio .text:after{bottom:29px;}
	.swiper-slide:hover .text:after{width:90px;}
	.inr_portfolio:after{bottom:-61px; background-size:130%;}
	.area_portfolio .tit_main{margin-bottom:40px;}
	
	.area_order ul li{width:-webkit-calc(33% - 4px); width:calc(33% - 4px);}
	.area_order ul li:nth-child(2n){margin-right:9px !important;}
	.area_order ul li:nth-child(3n){margin-right:0 !important;}
	.area_order ul li:nth-child(5),
	.area_order ul li:nth-child(6){display:block;}
	.area_list > div{height: auto;}
	.area_list ul li:last-child a{padding-bottom: 0;}
	.area_list ul li i{display:block;}
	.fp-tableCell,
	.fp-section.fp-table,
	.fp-slide.fp-table{height:auto !important;}
	#section1,
	#section2,
	#section3{padding:100px 0;}
	#fullpage #section2{background:url(../images/main/img_inrBg02.jpg) repeat 50% 50% !important;}
	.area_portfolio .tit_main a{margin-right:30px;}
}

@media all and (max-width:767px){
	.area_visual .bxslider li h2{font-size:47px;}
	.area_svg svg{height:98px;}
	.area_svg{left:20px; width:485px; height:98px;}
	.scroll_down{left:24px;}
	.tit_main h3{line-height:1.4; font-size:32px;}
	
	.area_about ul li{width:-webkit-calc(48% - 3px); width:calc(48% - 3px);}
	.area_about ul + em{margin-top:27px; font-size:28px;}

	.area_portfolio .tit_main{margin-bottom:30px;}
	.inr_portfolio .text em{font-size:14px;}
	.inr_portfolio .text{padding:18px;}
	.inr_portfolio .text:after{display:none;}
	.inr_portfolio .text span{margin-top:30px; font-size:12px;}
	.area_portfolio .tit_main a{margin-right:30px;}
	
	.area_order ul li{width:-webkit-calc(33% - 4px); width:calc(50% - 6px);}
	.area_order ul li:nth-child(2n){margin-right:0 !important;}
	.area_order ul li:nth-child(3n){margin-right:9px !important;}
	.area_order ul li:nth-child(5),
	.area_order ul li:nth-child(6){display:none;}
	.tit_main h4{line-height:2.5; font-size:18px;}
	#section1,
	#section2,
	#section3{padding:60px 0;}
}

@media all and (max-width:540px){
	.inr_padding{padding-left:15px !important;}
	.area_visual .bxslider li{background-position:29% 0px;}
	.area_visual .bxslider li h2{font-size:37px;}
	.area_visual .bxslider li h2 em{margin-left:9px;}
	.area_visual .bxslider li p{margin-top:8px;}

	.area_svg svg{height:74px;}
	.area_svg{left:20px; width:367px; height:74px;}
	.bx-pager.bx-default-pager,
	.total.section_left{display:none;}
	.total.section_left > em{right:110px;}
	.area_visualBottom:after{width:110px;}
	.area_visual .bx-controls-direction .bx-prev{right:56px;}
	.list_notice{padding:28px 0;}
	.scroll_down{bottom:7px;}
	.area_visual .bx-controls-direction{right:24px; bottom:21px;}
	.area_visualBottom:before{content:""; position:absolute; right:55px; bottom:0; z-index:9; width:55px; height:100%; background:#ededed;}
	.list_notice > a p{display:none;}
	.area_visual .bxslider li > div{margin-top:51%;}
	.area_svg{top:28%;}

	.area_about,
	.area_customer{margin-right:15px;}
	.area_about.inr_padding{padding-left:15px !important;}
	.area_about ul li{width:-webkit-calc(48% - -3px); width:calc(48% - -3px); margin-bottom:8px;}
.area_about ul li i {
    top: auto;
    left: 0;
    margin-top: -14px;
    margin-left: -46px;
    padding: 6px 9px;
    font-size: 13px;
    margin: 0;
    bottom: 6px;
    background-image: none;
    font-weight: 600;
}
.swiper-button-next:before {
    background: #7c7c7c;
}
	.area_about ul li:nth-child(2n){margin-left:8px;}
	.tit_main h3{line-height:1.7; font-size:25px;}
	.area_about .tit_main{margin-bottom:20px;}
	.area_about ul + em{margin-top: 22px;font-size:24px;}

	.inr_portfolio .text span{font-size:10px;}
	.inr_portfolio .text i{font-size:12px;}
	.area_portfolio .tit_main{margin-bottom:20px;}
	.area_customer .tit_main{margin-bottom:12px;}

	.area_order ul li .inr_order p{font-size:13px;}
	.area_order ul li .inr_order em{font-size:12px;}
	.area_order ul li .inr_order i{margin-top:13px; font-size:12px;}
	.area_order ul li:hover .inr_order:after{display:none;}
	.area_list ul li p{font-size:13px;}
	.area_list ul li em{padding:7px 9px; font-size:12px;}
	.area_list ul li span{font-size:10px;}
	.area_list ul li i{font-size:12px;}
	.area_list ul li a{padding:13px 0;}
	.area_list ul li:nth-child(3){border: 0;}
	.area_list ul li p{width:100%; margin-left:0;}
	.area_list ul li em{padding:7px; font-size:10px;}
	.area_list ul li a{position:relative;}
	.area_list ul li i{position:absolute; right:0; bottom:20px; line-height:1;}
	.area_list > div{height:213px; margin:21px 16px;}
	
	#section1,
	#section2,
	#section3{padding:40px 0;}
	.tit_main a{width:35px; height:35px;}
	.tit_main a:hover{width:35px;}
	.tit_main a span,
	.tit_main a:hover span{margin:17px 0px 0 13px;}

	
	.area_about ul + em + p{margin-top: 7px;font-size:13px;}
	.area_portfolio .tit_main a{margin-right:15px;}
}

@media all and (max-width:400px){
	.inr_padding{padding-left:20px !important;}
	.area_visual .bxslider li h2{font-size:33px;}
	.area_visual .bxslider li h2 em{margin-left:8px;}
	.area_visual .bxslider li p{margin-top:5px;}
	.area_about ul li{width:-webkit-calc(50% - 4px); width:calc(50% - 4px); margin-bottom:8px;}
	.tit_main h3{line-height:2; font-size:22px;}

	.area_about .tit_main{margin-bottom:10px;}
	.area_about ul + em{font-size:20px;}
	.inr_portfolio .text em{font-size:13px;}
}

@media all and (max-width:369px){
	.area_visual .bxslider li h2{font-size:29px;}

	.area_svg svg{height:54px;}
	.area_svg{left:20px; width:271px; height:54px;}
}

@media all and (-ms-high-contrast:none){
	.circle_area {display:none;}

	.btn_more a{background:url(../images/common/icon_btn01.svg) no-repeat 49px 0px; padding-right:40px;}
	.btn_more a i {margin:0; padding:6px 0;}
}

