
/* solution */

.solutionDiv {margin:100px 0;}
.solutionDiv .solutionKind {overflow:hidden;}
.solutionDiv .solutionKind li {transition:0.5s; position:relative; width:23.5%; height:538px; text-align:center; float:left; margin-right:2%;}
.solutionDiv .solutionKind li:hover .btnArea button {color:#fff; border:2px solid #fff;}
.solutionDiv .solutionKind li:hover p {color:#fff;}
.solutionDiv .solutionKind li:hover .moreBtn {opacity:1;}
.solutionDiv .solutionKind li .btnArea button:hover {background:#fff; border:2px solid #fff; color:#000;}
.solutionDiv .solutionKind li:last-child {margin-right:0;}
.solutionDiv .solutionKind li .tit {font-size:30px; font-weight:600; color:#181818; padding:68px 0 0;}
.solutionDiv .solutionKind li .txt {font-size:24px; color:#181818;}
.solutionDiv .solutionKind li .moreBtn {opacity:0;}
.solutionDiv .solutionKind li .btnArea_m {margin-top:20px; display:none; }
.solutionDiv .solutionKind li .btnArea_m button {transition:0.3s; width:103px; height:35px; line-height:35px; text-align:center; font-size:15px; color:#181818; border:2px solid #8c8c8c;}
.solutionDiv .solutionKind li .moreBtn button {display:inline-block; padding-right:67px; color:#fff; font-size:15px; background:url(../images/sub/moreArrow.png) no-repeat 100% 50%;}
.solutionDiv .solutionKind li .btnArea {margin:20px 0}
.solutionDiv .solutionKind li .btnArea button {transition:0.3s; width:71px; height:35px; line-height:35px; text-align:center; font-size:15px; color:#181818; border:2px solid #8c8c8c;}
.solutionDiv .solutionKind li .btnArea .btn1 {width:103px;}
.solutionDiv .solutionKind li.kind1 {background:url(../images/sub/solution_bg1.png) no-repeat 100% 100% #f1f1f1;}
.solutionDiv .solutionKind li.kind1:hover {background:url(../images/sub/solution_bg1.png) no-repeat 100% 100% #0090e8;}
.solutionDiv .solutionKind li.kind2 {background:url(../images/sub/solution_bg2.png) no-repeat 100% 100% #f1f1f1;}
.solutionDiv .solutionKind li.kind2:hover {background:url(../images/sub/solution_bg2.png) no-repeat 100% 100% #0090e8;}
.solutionDiv .solutionKind li.kind3 {background:url(../images/sub/solution_bg3.png) no-repeat 100% 100% #f1f1f1;}
.solutionDiv .solutionKind li.kind3:hover {background:url(../images/sub/solution_bg3.png) no-repeat 100% 100% #0090e8;}
.solutionDiv .solutionKind li.kind4 {background:url(../images/sub/solution_bg4.png) no-repeat 100% 100% #f1f1f1;}
.solutionDiv .solutionKind li.kind4:hover {background:url(../images/sub/solution_bg4.png) no-repeat 100% 100% #0090e8;}
.solutionDiv .solutionKind li.kind5 {background:url(../images/sub/solution_bg5.png) no-repeat 100% 100% #f1f1f1;}
.solutionDiv .solutionKind li.kind5:hover {background:url(../images/sub/solution_bg5.png) no-repeat 100% 100% #0090e8;}
.solutionDiv .solutionKind li .new {position:absolute; left:0; top:0;}

/* solution view */

.solution_view01 {padding:85px 0 0;position:relative;}
.solution_view01:before {position:absolute; left:0; top:85px; background-position:center; background-image:url(../images/sub/solution_bg.jpg); background-size:cover; width:1260px; max-width:100%; height:500px; content:''; display:block;}
.solution_view01 .titArea {position:relative;}
.solution_view01 .titArea .tit {padding-top:160px;}
.solution_view01 .titArea .tit p {font-size:50px; font-weight:600; color:#fff;}
.solution_view01 .titArea .tit span {font-weight:600; font-size:20px; color:#fff; display:block; margin-top:10px;}
.solution_view01 .titArea img {width:100%; position:relative; top:-160px;}
.solution_view01 .txtArea {position:relative; top:-180px;}
.solution_view01 .txtArea p {white-space:inherit; font-size:36px; font-weight:600; color:#333;}
.solution_view01 .txtArea p span {font-size:20px; font-weight:600; color:#999;}
.solution_view01 .txtArea .btnArea {margin-top:40px; }
.solution_view01 .txtArea .btnArea a {margin-right:3px;transition:0.3s; width:306px; height:60px; line-height:60px; display:inline-block; text-align:center; font-size:18px; color:#333; border:1px solid #333;}
.solution_view01 .txtArea .btnArea a:hover {background:#0090e8; border:1px solid #0090e8; color:#fff;}

.solution_view02 {padding:80px 0 105px; text-align:center; position:relative; background:url(../images/sub/solution_bg2.jpg) center bottom / cover ;}
.solution_view02 .txtArea p {font-size:36px; font-weight:600; color:#fff; margin-top:70px; white-space:inherit;}
.solution_view02 .txtArea p span {font-size:20px; font-weight:600; color:#bbb; display:block; margin-top:20px;}
.solution_view02 .txtArea .btnArea {margin-top:40px; }
.solution_view02 .txtArea .btnArea a {margin-right:3px; transition:0.3s; width:306px; height:60px; line-height:60px; display:inline-block; text-align:center; font-size:18px; color:#fff; border:1px solid #fff;}
.solution_view02 .txtArea .btnArea a:hover {background:#0090e8; border:1px solid #0090e8; color:#fff;}

.solution_view03 {padding:140px 0;}
.solution_view03 .tit {font-size:44px; font-weight:600; color:#333; margin-bottom:30px;}
.solution_view03 .snsImg {width:100%; height:400px; text-align:center; background:url(../images/sub/solution_bg3.jpg) center bottom / cover;}
.solution_view03 .snsImg p {font-size:100px; font-weight:600; color:#fff; padding-top:120px;}
.solution_view03 .snsUl1 {text-align:center; position:relative; top:-100px;}
.solution_view03 .snsUl1 li {text-align:center; display:inline-block; vertical-align:top; margin:0 15px;}
.solution_view03 .snsUl1 li:nth-child(1) .bgImg {background:url(../images/sub/solution_img3.png) center bottom / cover;}
.solution_view03 .snsUl1 li:nth-child(2) .bgImg {background:url(../images/sub/solution_img4.png) center bottom / cover;}
.solution_view03 .snsUl1 li .bgImg {width:450px; height:340px;}
.solution_view03 .snsUl1 li .bgImg p {font-size:40px; font-weight:600; color:#fff; padding-top:170px;}
.solution_view03 .snsUl1 li .txt {white-space:inherit; text-align:left; font-size:16px; color:#666; margin-top:15px;}
.solution_view03 .snsUl1 li .txt span {display:block; font-size:22px; font-weight:600; color:#333;}
.solution_view03 .snsUl2 {text-align:center;}
.solution_view03 .snsUl2 li img {width:100%;}
.solution_view03 .snsUl2 li {width:18%; display:inline-block; vertical-align:top; text-align:center; margin-right:25px;}
.solution_view03 .snsUl2 li:last-child {margin-right:0;}
.solution_view03 .snsUl2 li span {font-size:22px; color:#333; margin-top:15px; display:block;}
.solution_view03 .tit2 {font-size:36px; font-weight:600; color:#333; margin-top:70px; white-space:inherit;}
.solution_view03 .tit2 span {font-size:20px; font-weight:600; color:#bbb; display:block; margin-top:20px;}
.solution_view03 .btnArea {margin-top:40px; }
.solution_view03 .btnArea a {margin-right:3px;transition:0.3s; width:306px; height:60px; line-height:60px; display:inline-block; text-align:center; font-size:18px; color:#333; border:1px solid #333;}
.solution_view03 .btnArea a:hover {background:#0090e8; border:1px solid #0090e8; color:#fff;}

.solution_view04 .bgImg {width:100%; text-align:center; padding:140px 0; background:url(../images/sub/solution_bg4.jpg) center bottom / cover ;}
.solution_view04 .bgImg span {font-size:44px; font-weight:600; color:#fff; }
.solution_view04 .appUl {position:relative; top:-60px; margin-bottom:40px;}
.solution_view04 .appUl li {width:23%; display:inline-block; vertical-align:top; text-align:center; margin-right:25px;}
.solution_view04 .appUl li img {width:100%;}
.solution_view04 .appUl li:last-child {margin-right:0;}
.solution_view04 .appUl .btnArea {text-align:center; margin-top:20px;}
.solution_view04 .appUl .btnArea a {display:inline-block; transition:0.3s; width:80px; height:35px; line-height:35px; text-align:center; font-size:15px; color:#181818; border:1px solid #181818;}
.solution_view04 .appUl .btnArea a:hover {background:#0090e8; color:#fff; border:1px solid #0090e8;}
.solution_view04 .siteUl .txtArea {margin:175px 0 0 60px; }
.solution_view04 .siteUl .txtArea p span {display:block; font-size:36px; font-weight:600; color:#333; margin-bottom:10px;}
.solution_view04 .siteUl .txtArea p {font-size:20px; color:#666; white-space:inherit;}
.solution_view04 .siteUl .txtArea .viewBtn {margin-top:30px; transition:0.3s; display:inline-block; width:306px; height:60px; line-height:60px; text-align:center; font-size:18px; font-weight:500; color:#333; box-sizing:border-box; border:1px solid #333; text-align:center;}
.solution_view04 .siteUl .txtArea .viewBtn:hover {background:#0090e8; color:#fff; border:1px solid #0090e8;}
.solution_view04 .siteUl > li {overflow:hidden; margin-bottom:100px;}
.solution_view04 .siteUl > li > div {float:left;}
.solution_view04 .siteUl > li > div img {width:100%;}


/* sub common */
h2.sub_tit {font-family: 'Muli'; font-size: 5rem; letter-spacing: -1px; color: #fff; text-align: left; transition: font-size 0.5s ease-in-out; animation:tit_ani 1s linear; animation-fill-mode:both }
h3.sub_tit {font-family: 'Muli'; font-size: 5rem; color: #333; text-align: left; transition: font-size 0.5s ease-in-out;}

/* h2.sub_tit.on {transform: translateY(0);} */

@keyframes tit_ani {
    0% {
        transform: translateY(20px);
        opacity:0;
    }
    100% {
        transform: translateY(0px);
        opacity:1;
    }
}

.sub_txt p {animation:sub_ani 0.8s linear; animation-fill-mode:both; animation-delay: 1s;}

@keyframes sub_ani {
    0% {
        transform: translateX(-20px);
        opacity:0;
    }
    100% {
        transform: translateX(0px);
        opacity:1;
    }
}

#sub_visual .sub_txt a {animation:subA_ani 1s linear; animation-fill-mode:both; animation-delay: 1.5s;}

@keyframes subA_ani {
    0% {
     
        opacity:0;
    }
    100% {
       
        opacity:1;
    }
}

input {padding: 0 10px; font-size: 1rem; color: #333; border: 1px solid #e1e1e1; background-color: #fff;}
button {border: 0; background-color: transparent;}
select {padding: 0 10px; font-size: 1rem; color: #333; border: 1px solid #e1e1e1; background-color: #fff;}
textarea {width: 100%; padding: 10px; font-size: 1rem; color: #333; border: 1px solid #ddd; background-color: #fff;}

.mb0 {margin-bottom:0px !important;}

.sub_txt {padding: 10px 0 10px 30px; border-left: 1px solid #0090e8; text-align: left;}
.sub_txt p {line-height: 1.7; font-size: 1rem; font-weight: 300; color: #fff;}
.sub_txt p em {font-weight: 500;}
.sub_txt .contact_txt {margin: 5px 0 0 0;}
.sub_txt .contact_txt em {font-family: 'Muli'; font-weight: 700;}
.sub_txt .contact_txt span {padding: 0 10px 0 0;}




/* sub visual */
#sub_visual {position: relative; box-sizing: border-box; height: 500px; text-align: center; transition: all 0.5s ease-in-out;}
#sub_visual .inner {position: absolute; left: 0; right: 0; top: 180px; width: 1410px; margin: 0 auto; padding: 0;}
#sub_visual .sub_txt {margin: 40px 0 0 95px;}
#sub_visual .sub_txt a {position: relative; display: block; box-sizing: border-box; margin: 10px 0 0 0; width: 160px; height: 36px; padding: 0 25px; line-height: 34px; font-size: 1rem; font-weight: 500; color: #fff; border: 1px solid rgba(255, 255, 255, 0.5); opacity: 0.8; transition: all 0.5s ease-in-out;}
#sub_visual .sub_txt i {position: absolute; top: 50%; transform: translateY(-50%); right: 25px; opacity: 0.5; transition: all 0.5s ease-in-out;}
#sub_visual .sub_txt a:hover {opacity: 1;}
#sub_visual .sub_txt a:hover i {opacity: 1;}
#sub_visual .scroll_btn {position: absolute; right: 0; bottom: 0; display: block; box-sizing: border-box; width: 66px; height: 61px; padding: 15px 15px 0 0; background: url(../images/sub/scroll.png) no-repeat right 0; z-index: 1; transition: all 0.4s ease-in-out;}
#sub_visual .scroll_btn span {display: block; font-family: 'Muli'; font-size: 0.875rem; font-weight: 600; color: #fff;}
#sub_visual .scroll_btn:hover {bottom: -10px;}
/* 추가된 쇼셜네트워크 */
#sub_visual.sub_visual06 .inner { top:auto; bottom:40px; }
#sub_visual.sub_visual06 h3 { font-size:44px; color:#fff; text-align:left; }
#sub_visual.sub_visual06 .sub_txt { margin:0; border:none; padding:0; margin-top:10px; }
#sub_visual.sub_visual06 .sub_txt p.big { font-size:24px; margin:60px 0; }
.point_blue { background-image:url("../images/sub/point_blue.png"); background-position:center; background-repeat:no-repeat; background-size:contain; padding:60px 0; }
.yellow { color:#FEE500; }
#sub_visual.sub_visual06 .sub_txt a { width:300px; height:60px; display:inline-block; text-align:center; line-height:60px; }
#sub_visual.sub_visual06 .float_right { float:right; }
.solution_view01_shop:before { background-image:url("../images/sub/retailstore_bg.jpg"); }
.solution_view01_shop .titArea .tit { text-shadow:0 0 5px rgba(0,0,0,0.2);}

/* 쇼핑몰 얼리버드 예약 특전 */
.shoppingmall_earlybus { padding-top:130px; }
.shoppingmall_earlybus .tit { color:#0b0b0d; font-size:44px; }
.shoppingmall_earlybus ul { display:flex; flex-wrap:wrap; width:102%; margin:0 -1%; }
.shoppingmall_earlybus ul li { width:31.3%; margin:1%; height:auto; }
.shoppingmall_earlybus ul li:nth-of-type(1) .image_box { background-image:url("../images/sub/shoppingmall_earlybus01.jpg");}
.shoppingmall_earlybus ul li:nth-of-type(2) .image_box { background-image:url("../images/sub/shoppingmall_earlybus02.jpg");}
.shoppingmall_earlybus ul li:nth-of-type(3) .image_box { background-image:url("../images/sub/shoppingmall_earlybus03.jpg");}
.shoppingmall_earlybus .image_box { height:320px; background-position:center; background-repeat:no-repeat; background-size:cover; box-shadow:0 5px 10px rgba(0,0,0,0.05);}
.shoppingmall_earlybus .text_box { box-sizing:border-box; height:120px; width:calc(100% - 50px); box-shadow:0 5px 10px rgba(0,0,0,0.05); margin-top:-50px; background-color:#fff; position:relative; }
.shoppingmall_earlybus .text_box > div { position:absolute; top:50%; transform:translateY(-50%); left:25px; right:10px; }
.shoppingmall_earlybus .text_box h6 { font-size:22px; font-weight:600; }
.shoppingmall_earlybus .text_box h6 b { font-size:26px; font-weight:700; }
.shoppingmall_earlybus .text_box h6 span { font-weight:300; font-size:16px; }
.shoppingmall_earlybus .text_box p { font-size:20px; font-size:500;  margin-top:10px;}

.sub_visual01 {background: url(../images/sub/sub_visual01.jpg) no-repeat center center / cover;}
.sub_visual02 {background: url(../images/sub/sub_visual02.jpg) no-repeat center center / cover;}
.sub_visual03 {background: url(../images/sub/sub_visual01.jpg) no-repeat center center / cover;}
.sub_visual04 {background: url(../images/sub/sub_visual02.jpg) no-repeat center center / cover;}
.sub_visual05 {background: url(../images/sub/sub_visual03.jpg) no-repeat center center / cover;}
.sub_visual06 {background: url(../images/sub/sub_visual06.jpg) no-repeat center center / cover;}






/* sub contents */

.sub_contents .inner {width: 1410px; margin: 0 auto; padding: 0;}
.sub_contents .inner2 {width: 1170px; margin: 0 auto; padding: 0;}




/* About */
.about {overflow: hidden; padding: 140px 0;}
.about .sub_con {padding: 60px 0;}
.about .sub_con:after {display: block; clear: both; *zoom: 1; content: '';}
.about .sub_con .con_tit {float: left; width: 210px; padding: 10px 0 0 0; font-size: 1.375rem; font-weight: 500; color: #333;}
.about .sub_con .sub_txt {float: left;}
.about .sub_con .sub_txt p {color: #666;}

.v_align {position: absolute; top: 50%; transform: translateY(-50%);}

.about_avan {background: url(../images/sub/about_avan_bg01.jpg) no-repeat 0 0 / cover;}
.about_avan .avan_title strong {display: block; line-height: 170px; font-family: 'Muli'; font-size: 13.75rem; font-weight: 700; color: #333;}
.about_avan .avan_title strong:nth-child(2) {padding: 30px 0 0 360px;}
.about_avan .avan_con01 {position: relative; margin: 100px 0; height: 460px; background: url(../images/sub/about_avan_img01.jpg) no-repeat right 0;}
.about_avan .avan_con01 div {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; width: 930px; margin: 0 auto;}
.about_avan .avan_con01 div strong {display: block; font-family: 'Muli'; font-size: 3.25rem; color: #333; letter-spacing: -2.5px; border-bottom: 2px solid #333;}
.about_avan .avan_con01 div p {padding: 30px 130px 0 0; font-size: 1.2rem; font-weight: 300; color: #666; text-align: right;}
.about_avan .avan_con02:after {display: block; clear: both; *zoom: 1; content: '';}
.about_avan .avan_con02 li {position: relative; float: left; box-sizing: border-box;}
.about_avan .avan_con02 li:nth-child(2) {width: calc(100% - 705px); height: 470px;}
.about_avan .avan_con02 li img {vertical-align: top;}
.about_avan .avan_con02 li div {left: 150px; width: 38%;}
.about_avan .avan_con02 div strong {font-family: 'Muli'; font-size: 3.25rem; color: #333; letter-spacing: -2.5px; border-bottom: 2px solid #333;}
.about_avan .avan_con02 div p {padding: 30px 0 0 120px; font-weight: 300; color: #666;  font-size: 1.2rem;}

.about_goal {background: url(../images/sub/about_goal_bg.jpg) no-repeat 0 0 / cover;}
.about_goal h3.sub_tit {color: #fff;}
.about_goal .goal_con .con_tit {width: 40%; color: #fff;}
.about_goal .goal_con .goal_list {float: left; width: 60%; color: #fff;}
.about_goal .goal_con .goal_list li {margin: 50px 0 0 0;}
.about_goal .goal_con .goal_list li:first-child {margin: 0;}
.about_goal .goal_con .goal_list strong {display: block; line-height: 1.4; font-size: 1.8rem; font-weight: 100;}
.about_goal .goal_con .goal_list strong em {font-size: 2.125rem; font-weight: 300;}
.about_goal .goal_con .goal_list .sub_txt {float: none; box-sizing: border-box; margin: 20px 0 0 0; width: 100%;}
.about_goal .goal_con .goal_list .sub_txt p {color: #fff;}

.about_service {background-color: #fbfbfb;}
.about_service .sevice_list > li {position: relative; margin: 100px 0 0 0; height: 420px;}
.about_service .sevice_list > li:after {display: block; clear: both; *zoom: 1; content: '';}
.about_service .sevice_list > li:first-child {margin: 0;}
.about_service .sevice_list .img_box {position: absolute; top: 50%; transform: translateY(-50%); left: 55%; z-index: 1;}
.about_service .sevice_list .img_box img {max-width: 100%;}
.about_service .sevice_list .txt_box {position: relative; width: 1065px; height: 420px; background-color: #fff;}
.about_service .sevice_list .txt_wrap {position: absolute; top: 50%; transform: translateY(-50%); left: 255px;}
.about_service .sevice_list .txt_wrap strong {position: relative; display: block; padding: 0 0 25px 0; margin: 0 0 25px 0; font-size: 1.875rem; font-weight: 300; color: #333;}
.about_service .sevice_list .txt_wrap strong:after {display: block; position: absolute; left: 0; bottom: 0; width: 40px; height: 1px; background-color: #0090e8; content: '';}
.about_service .sevice_list .txt_wrap strong span {padding: 0 0 0 10px; font-family: 'Muli'; font-size: 0.875rem; font-weight: 400; color: #999;}
.about_service .sevice_list .txt_wrap em {display: block; margin: 0 0 10px 0; font-size: 1.125rem; font-weight: 300; color: #666;}
.about_service .sevice_list .txt_wrap p {line-height: 2.2; color: #999;}
.about_service .sevice_list .point_list {margin: 20px 0 0 0;}
.about_service .sevice_list .point_list:after {display: block; clear: both; *zoom: 1; content: '';}
.about_service .sevice_list .point_list li {float: left; display: table; box-sizing: border-box; margin: 0 0 0 30px; width: 90px; height: 90px; border-radius: 50%; background: url(../images/sub/point_bg.png) no-repeat 0 0;}
.about_service .sevice_list .point_list li:first-child {margin: 0;}
.about_service .sevice_list .point_list li div {display: table; width: 90px; height: 90px;}
.about_service .sevice_list .point_list li p {display: table-cell; line-height: 1.4; font-size: 0.875rem; font-weight: 400; color: #666; text-align: center; vertical-align: middle;}
.about_service .sevice_list li:nth-child(2n) .img_box {left: auto; right: 55%;}
.about_service .sevice_list li:nth-child(2n) .txt_box {position: absolute; right: 0;}
.about_service .sevice_list li:nth-child(2n) .txt_wrap {left: 240px;}

.clients_list {box-sizing: border-box; width: 100%; border: 1px solid #ddd; border-bottom: 0; border-right: 0;}
.clients_list:after {display: block; clear: both; *zoom: 1; content: '';}
.clients_list li {float: left; box-sizing: border-box; width: 20%; height: 120px; line-height: 120px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; text-align: center; cursor: pointer;}
.clients_list li img {opacity: 1; width: 70%; vertical-align: middle; transition: all 0.5s ease-in-out;}
.clients_list li:hover img {opacity: 0.3;}

.btn_box {margin: 80px 0 0 0; padding: 35px 0 0 0; border-top: 1px solid #ddd; text-align: center;}
.btn_box .btn_more {font-family: 'Muli'; font-size: 0.875rem; font-weight: 600; color: #333; border: 0; transition: all 0.5s ease-in-out;}
.btn_box .btn_more:hover {color: #0090e8;}



/* Project */

.project {padding: 75px 0;}
.project_tab {margin: 0 0 50px 0;}
.project_tab:after {display: block; clear: both; *zoom: 1; content: '';}
.project_tab li {float: left; margin: 0 0 0 40px;}
.project_tab li:first-child {margin: 0;}
.project_tab li a {display: block; line-height: 1.7; font-family: 'Muli'; font-size: 1.125rem; font-weight: 600; color: #999;}
.project_tab li.active a {color: #333; border-bottom: 1px solid #0090e8;}
.m_project_tab {display: none; position: relative; width: 100%; margin: 0 auto 50px; z-index: 6;}
.m_project_tab .tab_select {display: inline-block; box-sizing: border-box; width: 100%; height:50px; line-height: 50px; font-family: 'Muli'; font-size: 1.25rem; font-weight: 600; color: #000; text-align-last: center; background: #fff url(../images/sub/arrow.png) no-repeat 95% center; border: 1px solid #000;}


.project_list:after {display: block; clear: both; *zoom: 1; content: '';}
.project_list li {float: left; width: 23.5%; margin: 0 0 2% 2%; transition: all 0.5s ease-in-out;}
.project_list li:nth-child(4n + 1) {margin: 0 0 2% 0;}
.project_list li a {position: relative; display: block; width: 100%; height: 100%;}
.project_list li .img_box img {width: 100%; vertical-align: top;}
.project_list li .hover_box {visibility: hidden; opacity: 0; position: absolute; top: 0; left: 0; right: 0; bottom: 0; box-sizing: border-box; width: 100%; height: 100%; padding: 30px; color: #fff; background-color: rgba(0, 0, 0, 0.8); transition: all 0.5s ease-in-out;}
.project_list li .hover_box p {font-size: 1rem; font-weight: 500; color: #fff;}
.project_list li .hover_box span {font-family: 'Muli'; font-size: 0.75rem; font-weight: 700; color: #fff; opacity: 0.5;}
.project_list li .hover_box .btn_view {position: absolute; left: 30px; bottom: 30px; width: 62px; height: 24px; line-height: 22px; font-family: 'Muli'; font-size: 0.875rem; font-weight: 700; color: #fff; border-bottom: 2px solid #0090e8; text-align: left;}
.project_list li .hover_box .btn_view:before {display: block; position: absolute; bottom: 4px; right: 0; transform: rotate(35deg); width: 18px; height: 2px; background-color: #0090e8; content: '';}
.project_list li:hover {transform: scale(1.06); box-shadow: 5px 10px 18px rgba(30, 36, 47, 0.4);}
.project_list li:hover .hover_box {visibility: visible; opacity: 1;}
.project_list .no_data {margin: 150px 0; font-family: 'Muli'; font-size: 1.25rem; font-weight: 600; color: #000; text-align: center;}


/* Project view */


.project_title_wrap {position: fixed; top: 60px; left: 0; right: 0; width: 100%; height: 60px; margin: 0 auto; background-color: rgba(0, 0, 0, 0.75);}
.project_title {width: 100%; height: 60px; text-align: center;}
.project_title li {display: inline-block; width: 300px;}
.project_title li a {display: block; width: 100%; line-height: 60px; color: #bbb; text-align: center;}
.project_title li a:hover {color: #8ad3ff;}
.project_title li.title {position: relative; min-width: 60px; width: auto; line-height: 60px; color: #fff; text-align: center;}
.project_title li.title:before {display: block; position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto; width: 60px; height: 1px; background-color: #0090e8; content: '';}
.project_title li.prev_title a {text-align: right;}
.project_title li.next_title a {text-align: left;}
.project_title li.tit_arrow {width: 10px; margin: 0 100px;}
.project_title li.tit_arrow img {display:inline-block; cursor: pointer;}

.top_visual {position: relative; width: 100%; height: 600px; margin: 60px auto 0; display:table;}
.top_visual .visual_txtwrap { text-align:center; color:#fff; display:table-cell; vertical-align:middle; }
.top_visual .visual_txtwrap .txt01 {font-size: 2.75rem; font-weight: 600;}
.top_visual .visual_txtwrap .txt01:after {display: block; width: 1px; height: 30px; margin: 25px auto; background-color: #a0eaff; content:'';}
.top_visual .visual_txtwrap .txt02 {line-height: 1.6;}
.top_visual .visual_txtwrap a {display: block; box-sizing: border-box; width: 240px; height: 50px; margin: 45px auto 0; line-height:48px; background-color: transparent; border: 1px solid #a0eaff; transition: all 0.5s ease-in-out;}
.top_visual .visual_txtwrap a:hover {background-color: #53aac3; color: #fff; border: 1px solid #53aac3;}
.top_visual .visual_txtwrap a span {display: inline-block; margin: 0 0 0 5px; font-size: 0.875rem;}

.project_img {max-width: 1400px; margin: 0 auto;}
.project_img img {width: 100%; vertical-align: top;}

.list_btn {display: block; box-sizing: border-box; width:240px; height:60px; line-height:60px; text-align: center; font-family: 'Muli'; font-size: 1.125rem; font-weight: 600; color: #fff; border: 1px solid #1f1f1f; background:#1f1f1f; margin: 70px auto 150px; cursor:pointer; transition: all 0.5s ease-in-out;}
.list_btn:hover {background-color: #fff; color: #000;}




/* News */

.news {margin-top:70px;}
.avanstoryCon {position: relative;}
.avanstoryCon ul {width: 100%;}
.avanstoryCon ul:after {display: block; clear: both; *zoom: 1; content: '';}
.avanstoryCon ul li {position: relative; float: left; box-sizing: border-box; width:32%; margin: 0 0 2% 2%; border: 1px solid #d7d7d7;}
.avanstoryCon ul li:nth-child(3n + 1) {margin: 0 0 2% 0;}
.avanstoryCon .stoty_img {position: relative; overflow: hidden; background-color: #000;}
.avanstoryCon .stoty_img > img {width: 100% !important; height: auto !important; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale(1); transform: scale(1); vertical-align: middle;}
.avanstoryCon ul li:hover .stoty_img > img {transform: scale(1.1);}
.avanstoryCon ul li:hover .areas_hv {visibility: visible; opacity: 1;}
.avanstoryCon ul li .areas_hv {visibility: hidden; opacity: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; transition: all 0.5s ease-in-out;}
.avanstoryCon ul li .areas_hv .areas_hv_bg {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5);}
.avanstoryCon ul li .areas_hv img {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto;}
.avanstoryCon ul li .story_txt {padding: 20px 35px 20px 20px;}
.avanstoryCon ul li .story_txt .txt01 {display: block; overflow: hidden; font-size: 1.125rem; font-weight: 600; color: #444; text-overflow: ellipsis; white-space: nowrap; word-break: break-all;}
.avanstoryCon ul li .story_txt .txt02 {overflow: hidden; margin: 20px 0; height: 3.2em; line-height: 1.6em; font-size: 0.875rem; color: #888; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.avanstoryCon ul li .story_txt .day {font-size: 0.75rem; color: #666;}


/* News view */

/*.avanstoryCon .view_box {padding: 0 0 140px 0;}*/
.avanstoryCon .view_box .view_title {margin: 0 0 50px 0; padding: 20px 10px 40px; border-bottom: 1px solid #514846; text-align: center;}
.avanstoryCon .view_box .view_title .title {font-size: 2.25rem; color: #333;}
.avanstoryCon .view_box .view_title .day {margin: 15px 0 0 0; font-size: 1.125rem; color: #888;}
.avanstoryCon .view_box .view_file {height: 50px; line-height: 50px; padding: 0 20px; font-size: 0.9375rem; border-bottom: 1px solid #ddd;}
.avanstoryCon .view_box .view_file a {border-left: 1px solid #ddd; margin: 0 0 0 10px; padding: 0 0 0 10px;}
.avanstoryCon .view_box .view_file img {margin: 0 0 0 5px; vertical-align: middle;}
.avanstoryCon .view_box .view_file .views {float: right; font-size: 0.9375rem; color: #888;}
.avanstoryCon .view_box .view_file .views span {margin: 0 0 0 10px; padding: 0 0 0 10px; border-left:1px solid #ddd;}
.avanstoryCon .view_box img {width: auto !important; max-width: 100%; height: auto !important;}
.avanstoryCon .view_box .view_txt {padding: 30px 40px; border-bottom: 1px solid #888;}
.avanstoryCon .view_box .view_txt span {display: inherit; margin: 0 0 20px 0; text-align: center;}
.avanstoryCon .view_box .view_txt p {line-height: 1.9; font-size: 0.9375rem; color: #666;}
.avanstoryCon .next_post {border-top: 1px solid #ddd;}
.avanstoryCon .next_post,
.avanstoryCon .prev_post {height: 50px; line-height: 50px; padding: 0 40px; font-size: 0.875rem; color: #333; border-bottom: 1px solid #ddd;}
.avanstoryCon .prev_post:after {display: block; clear: both; *zoom: 1; content: '';}
.avanstoryCon .next_post span,
.avanstoryCon .prev_post span {float: left; width: 50px; font-size: 0.9375rem;}
.avanstoryCon .next_post a,
.avanstoryCon .prev_post a {float: left; overflow: hidden; box-sizing: border-box; width: calc(100% - 50px); padding: 0 0 0 30px; font-size: 0.9375rem; text-overflow: ellipsis; white-space: nowrap; word-break: break-all;}
.avanstoryCon .list_btn {margin: 70px auto;}
/*
.avanstoryCon .btn_wrap {position: absolute; bottom: 50px; right: 0;}
.avanstoryCon .btn_wrap a {display: block; width: 130px; height: 45px; line-height: 45px; font-size: 1rem; color: #666; text-align: center; vertical-align: middle; background: #fff; border: 1px solid #666; transition: all 0.5s ease-in-out;}
.avanstoryCon .btn_wrap a:hover {color: #fff; background: #666;}
*/



/* contact */

.contact {padding: 140px 0 0 0;}
.contact_Con .contact_ul01 {margin: 100px 0 0 0;}
.contact_Con .contact_ul01:after {display: block; clear: both; *zoom: 1; content: '';}
.contact_Con .contact_ul01 li {float:left; width:48%; margin-right:4%;}
.contact_Con .contact_ul01 li:last-child {margin-right:0;}
.contact_Con .contact_ul01 li input[type="text"] {width:100%; height:48px; line-height:48px; font-size:16px; color:#666; padding:0 20px; margin-bottom:10px; border:1px solid #e8e8e8; box-sizing:border-box; -webkit-border-radius:0; -webkit-appearance:none;}
.contact_Con .contact_ul01 li select {width:100%; height:48px; line-height: 48px; font-size: 16px; color: #d8d8d8; padding:0 20px; margin-bottom: 10px; border: 1px solid #e8e8e8; box-sizing: border-box; -webkit-border-radius:0;-webkit-appearance: none; -moz-appearance: none;appearance: none; background: url(../images/sub/sel_arr.png) no-repeat 97% 50% ; background-size: 15px;}
::placeholder {color: #d8d8d8; opacity: 1;}
:-ms-input-placeholder {color: #d8d8d8 !important;}
::-ms-input-placeholder {color: #d8d8d8;}
.filebox {box-sizing: border-box; width: 100%; padding: 8px 10px; margin: 0 0 10px 0; height: 48px; line-height: 48px; color: #666; border: 1px solid #e8e8e8; text-align: left;}
.filebox:after {display: block; clear: both; *zoom: 1; content: '';}
.filebox label {float: left; width: 80px; margin: 0 10px 0 0; height: 32px; line-height: 32px; color: #fff; text-align: center; background: #43b7ff; cursor: pointer;}
.filebox input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;}
.filebox .upload_name {float: left; width: calc(100% - 90px); height: 32px; line-height: 32px; margin: 0; color: #666; background: none; border: none;}
.contact_Con .contact_ul01 .visit_radio {box-sizing: border-box; width: 100%; padding: 0 20px; margin: 0 0 10px 0; line-height: 48px; color: #666;}
.contact_Con .contact_ul01 .visit_radio span {position: relative; float: left; display: block; box-sizing: border-box; width: 75px; padding: 0 15px 0 0; margin: 0 15px 0 0;}
.contact_Con .contact_ul01 .visit_radio span:after {position: absolute; top: 15px; right: 0; display: block; width: 2px; height: 20px; background-color: #e8e8e8; content: '';}
.contact_Con .contact_ul01 .visit_radio .input_wrap {float: left; width: calc(100% - 90px);}
.contact_Con .contact_ul01 .visit_radio .input_wrap div {float: left;}
.contact_Con .contact_ul01 .visit_radio label {color: #666; margin: 0 20px 0 5px;}
.contact_Con .contact_ul01 .visit_radio input[type="radio"] {width: 18px; height: 18px; vertical-align: sub;}
.contact_Con .contact_ul01 .visit_radio input[type="checkbox"] {width: 18px; height: 18px; vertical-align: sub;}

.contact_Con .contact_ul01 li input[type="checkbox"] {width:15px; height:15px; vertical-align:middle; margin-right:5px;}

.contact_Con .send_btn {display: block; box-sizing: border-box; width:240px; height:60px; line-height:60px; text-align: center; font-family: 'Muli'; font-size: 1.125rem; font-weight: 600; color: #fff; border: 1px solid #1f1f1f; background:#1f1f1f; margin: 70px auto 150px; cursor:pointer; transition: all 0.5s ease-in-out;}
.contact_Con .send_btn:hover {background-color: #fff; color: #000;}
.contact_Con .privacy_box {margin: 20px 0 0 0;}
.contact_Con .privacy_box:after {display: block; clear: both; *zoom: 1; content: '';}
.contact_Con .privacy_box li {float: left; width: 50%;}
.contact_Con .privacy_box .privacy_con {height:105px; font-size:14px;}
.contact_Con .privacy_box .privacy_tit {color: #666;}
.contact_Con .privacy_box .privacy_tit .more_view_btn01  {height:30px; width:70px; color:#3687d0; display:inline-block; margin-left:20px; border:1px solid #3687d0; line-height:30px; text-align:center; font-size:14px; cursor:pointer; border-radius:5px; transition:0.5s}
.contact_Con .privacy_box .privacy_tit .more_view_btn01:hover {background:#3687d0; color:#fff;}
.contact_Con .privacy_box .privacy_tit .more_view_btn02  {height:30px; width:70px; color:#3687d0; display:inline-block; margin-left:20px; border:1px solid #3687d0; line-height:30px; text-align:center; font-size:14px; cursor:pointer; border-radius:5px; transition:0.5s}
.contact_Con .privacy_box .privacy_tit .more_view_btn02:hover {background:#3687d0; color:#fff;}
.contact_Con .privacy_box .privacy_check {text-align: right; margin-top:10px;}
.contact_Con .privacy_box .privacy_check div {display: inline-block;}
.contact_Con .privacy_box .privacy_check input[type="radio"] {width: 18px; height: 18px; margin: 0 0 0 15px; vertical-align: sub;}
.contact_Con .privacy_box .privacy_check label {margin: 0 0 0 5px}
.contact_Con .inquire_con textarea {width:100%; font-size:16px; color:#666; padding:20px; border:1px solid #e8e8e8; box-sizing:border-box; height:400px;}
.avan_map iframe {height: 600px; vertical-align: top;}



/* Careers */

.top_box {margin-bottom: 80px; text-align: center;}
.top_box .txt01 {font-size: 2.25rem; color: #444; font-weight: 600; margin-bottom: 10px; line-height: 1;}
.top_box .txt02 {font-size: 1.5rem; color: #666; line-height: 34px}
.top_box .txt03 {margin: 20px 0 0 0; font-size: 1.75rem; font-weight: 600; color: #3687d0; text-decoration: underline;}
.top_box .txt04 {margin: 20px 0 0 0; font-family: 'Muli'; font-size:2.625rem; font-weight: 700; color: #3687d0;}
.top_box .txt04 a {display: block; font-family: 'Muli';}
.top_box .txt05 {display: inline-block; margin: 10px 0 0 0; color: #666; border-bottom:1px solid #666;}
.top_box .txt05 a {font-family: 'Muli'; font-weight: 600; font-size: 1.125rem;}

.careers_txt  {margin: 0 0 80px 0; background: #343434;}
.careers_txt ul:after {display: block; clear: both; *zoom: 1; content: '';}
.careers_txt ul li {float: left; width: 50%; line-height: 100px; color: #fff; text-align: center;}
.careers_txt ul li span {display: inline-block; padding: 0 10px 0 0; font-size: 1.25rem; font-weight: 600; color: #e4df40; vertical-align: top;}

.careers {padding: 140px 0;}
.careers_list {overflow: hidden; border-top: 1px solid #000;}
.careers_list li {border-bottom: 1px solid #ddd;}
.careers_list li div.open {background: url(../images/sub/careers_on.png)no-repeat 97% 28px;}
.careers_list li .job {padding: 30px; font-family: 'Muli'; font-size: 1.375rem; font-weight: 700; background: url(../images/sub/careers.png)no-repeat 97% 28px; cursor:pointer;}
.careers_list li .job_content {display: none; position: relative; padding: 50px; font-size: 0.8125rem; background: #ebf1f7;}

.job_content .name {font-family: 'Muli'; font-size: 2.25rem; font-weight: 700; line-height: 1;}
.job_content .pt {display: block; margin: 30px 0 0 0; line-height: 1; font-size: 1.5rem;}
.job_content .txt {margin: 10px 0 0 0; font-size: 1.125rem; line-height: 1;}
.job_content .txt .name02 {font-size: 1.375rem; font-weight: 600; color: #3687d0;}
.job_content .support_btn {position:absolute; top: 0; bottom: 0; right: 30px; display: block; margin: auto; width: 200px; height: 50px; line-height: 50px; font-size: 1rem; color:#fff; background: #3687d0; text-align: center; cursor: pointer;}





/* list paging */

.list_page {margin: 70px 0 100px; text-align: center;}
.list_page .first2_btn,
.list_page .last2_btn {display: inline-block; width: 35px; height: 35px; text-indent: -9999px; vertical-align: bottom;}
.list_page .first2_btn {margin: 0 5px 0 0; background: url(../images/sub/arrow_l.png) no-repeat 0 0;}
.list_page .last2_btn {margin: 0 0 0 5px; background: url(../images/sub/arrow_r.png) no-repeat 0 0;}
.list_page ul {display: inline-block; vertical-align: bottom;}
.list_page ul:after {display: block; clear: both; *zoom: 1; content: '';}
.list_page ul li {float: left; margin: 0 5px;}
.list_page ul li:hover a,
.list_page ul li a.on {color: #fff; background-color: #1f1f1f;}
.list_page ul li a {display: block; box-sizing:border-box; width: 35px; height: 35px; line-height: 35px; font-family: 'Muli'; font-size: 1rem; font-weight: 700; color: #444; text-align: center; transition: all 0.5s ease-in-out;}



/* popup */

.popup {display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 10;}
.popup .popup_wrap {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; box-sizing: border-box; margin: 0 auto; width: 510px; height: 320px; padding: 30px; font-weight: 300; background: rgba(0, 0, 0, 0.85); text-align: center; color: #fff;}
.popup .popup_wrap strong {position: relative; display: block; padding: 10px 0 25px 0; margin: 0 0 25px 0; font-size: 1.625rem; font-weight: 300;}
.popup .popup_wrap strong:after {display: block; position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto; width: 60px; height: 1px; background-color: #0090e8; content: '';}
.popup .popup_wrap .btn_ok {margin: 40px 0 0 0; width: 100%; height: 60px; font-size: 1.125rem; text-align: center; color: #fff; background-color: #0090e8;}

/* Careers popup */
.support_Wrap {display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background:rgba(0,0,0,0.5); z-index: 99;}
.support {position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; width: 50%; height: 75%; background: #fff;}
.support .close {position: absolute; top: 0; right: -40px; width: 30px; height: 30px; cursor: pointer;}
.support .close img {width: 100%; vertical-align: top;}
.support .title {font-size: 1.875rem; text-align: center;}
.support form {width: 90%; margin: auto;}
.support .scroll_wrap { overflow-y:scroll; height: 100%; box-sizing: border-box; padding:40px 20px; box-shadow:0 5px 15px rgba(0, 0, 0, 0.5);}
.support .scroll_wrap .txt {margin: 40px 0 0 0; line-height: 1.5; color:#666;}
.support .scroll_wrap input[type="checkbox"] {width: 18px; height: 18px; vertical-align: middle;}
.support .scroll_wrap label {margin: 0 0 0 5px;}
.support .scroll_wrap .filebox {margin: 10px 0 0 0; vertical-align: top;}
.support .select_box { width:100%; height:54px; font-size:16px; color:#666; box-sizing:border-box; position:relative; margin-top:40px;}
.support .select_box .top_name {padding: 0 20px; line-height: 54px; font-size: 1.25rem; background: url(../images/sub/select_arrow.png) no-repeat 96% center; border: 1px solid #e8e8e8;}
.support .select_box .select_menu {position: absolute; top:56px;   border:1px solid #e8e8e8 ; border-top:0; width:100%; box-sizing:border-box; display:none; background:#fff;}
.support .select_box .select_menu li {line-height: 60px; padding: 0 20px; font-size: 1.25rem; cursor:pointer; }
.support .select_box .select_menu li:hover { background:#f8f8f8;}
.support input { border:1px solid #e8e8e8 ; width:49.6%; height: 54px; font-size: 1.25rem; padding:0 20px; box-sizing:border-box; color:#666; margin-top:10px;}
.support input[type="text"], .support input[type="email"] {border-radius: 0; -moz-appearance: none; -webkit-appearance: none; appearance: none;}
.support textarea {width: 100%; height: 150px; padding: 20px; font-size: 1rem; color: #666; white-space: pre-line; border: 1px solid #e8e8e8;}
.support textarea.cont_txt { font-size:20px; margin-top:10px;}
.support .txt01 {margin: 10px 0 5px; font-size: 1.125rem; color: #444;}
.support input[type="checkbox"] {width: 16px; height: 16px; padding: 0; margin: 0; vertical-align: middle;}
.support input[type="submit"] {display: block; margin: 50px auto 0; width: 240px; height: 60px; line-height: 60px; font-size: 1.125rem; color: #fff; background: #1f1f1f; border-radius: 0; -moz-appearance: none; -webkit-appearance: none; appearance: none;}

.support .filebox {display: inline-block; box-sizing: border-box; width: 49.6%; height: 54px; padding: 8px 10px; margin: 0 0 10px 0; line-height: 54px; color: #666; border: 1px solid #e8e8e8;}
.support .filebox label {height: 36px; line-height: 36px; margin: 0 10px 0 0;}
.support .filebox .upload_name {height: 36px; line-height: 36px;}




.topTxt1 {margin: 140px 0 0 0; font-size:2.25rem; color:#1f1f1f; font-weight:normal; text-align: center;}
.data {margin:60px 0 100px; text-align:left;}
.data .tit {font-size:1.375rem; color:#1f1f1f; margin-bottom:25px; font-weight:600;}
.data .con {color:#666; line-height:25px; margin-bottom:50px}






@media screen and (min-width:1201px) and (max-width: 1600px) {



	#sub_visual .inner {width: 100%; padding: 0 60px;}
	#sub_visual h2 {font-size: 4.5rem;}
	#sub_visual .scroll_btn {right: 60px;}

	.sub_contents .inner {box-sizing: border-box; width: 100%; padding: 0 60px;}

	/* About */
	.about_avan .avan_con02 li div {left: 100px; width: 65%;}
	.about_avan .avan_con02 div p {padding: 30px 0 0 30px}

	.about_service .sevice_list .img_box {right: 5%; width: 40%;}
	.about_service .sevice_list .img_box img {max-width: 100%;}
	.about_service .sevice_list .txt_box {width: 60%;}
	.about_service .sevice_list .txt_wrap {left: 5%;}
	.about_service .sevice_list li:nth-child(2n) .img_box {left: 5%; right: auto;}
	.about_service .sevice_list li:nth-child(2n) .txt_wrap {left: auto; right: 5%;}

	/* Project view */
	.project_title li.tit_arrow {margin: 0 70px;}

	.sub_contents .inner2 {width:100%;}


}

@media screen and (min-width:1025px) and (max-width: 1200px) {

	#sub_visual .inner {width: 100%; padding: 0 60px;}
	#sub_visual h2 {font-size: 4.5rem;}
	#sub_visual .scroll_btn {right: 60px;}

	.sub_contents .inner {box-sizing: border-box; width: 100%; padding: 0 60px;}

	/* About */
	.about_avan .avan_con02 li div {left: 100px; width: 65%;}
	.about_avan .avan_con02 div p {padding: 30px 0 0 60px}

	.about_goal .goal_con .con_tit {width: 30%;}
	.about_goal .goal_con .goal_list {width: 70%;}

	.about_service .sevice_list .img_box {right: 5%; width: 40%;}
	.about_service .sevice_list .img_box img {max-width: 100%;}
	.about_service .sevice_list .txt_box {width: 60%;}
	.about_service .sevice_list .txt_wrap {left: 5%;}
	.about_service .sevice_list li:nth-child(2n) .img_box {left: 5%; right: auto;}
	.about_service .sevice_list li:nth-child(2n) .txt_wrap {left: auto; right: 5%;}

	/* Project */
	.project_list li {width: 32%;}
	.project_list li:nth-child(4n + 1) {margin: 0 0 2% 2%;}
	.project_list li:nth-child(3n + 1) {margin: 0 0 2% 0;}

	/* Project view */
	.project_title li.tit_arrow {margin: 0 70px;}
	.project_title li.prev_title, .project_title li.next_title {display: none;}


	/* News */
	.avanstoryCon ul li {width: 49%;}
	.avanstoryCon ul li:nth-child(3n + 1) {margin: 0 0 2% 2%;}
	.avanstoryCon ul li:nth-child(2n + 1) {margin: 0 0 2% 0;}


	/* Careers */
	.careers_txt ul li {float: none; width: 100%;}
	.job_content .support_btn {position: static; margin: 30px 0 0 0;}


	/* Careers popup */
	.support {width: 60%;}

	.sub_contents .inner2 {width:100%;}

	.solution_view04 .siteUl > li .imgArea {width:50%;}
	.solution_view04 .siteUl .txtArea {margin:0; width:45%; float:right;}

	/* 쇼핑몰 얼리버스 예약 특전 */
	.shoppingmall_earlybus .text_box { width:100%; }
	.shoppingmall_earlybus .text_box h6 { font-size:20px; }
	.shoppingmall_earlybus .text_box h6 b { font-size:22px; }
	.shoppingmall_earlybus .text_box p { font-size:16px; }
	.shoppingmall_earlybus .text_box h6 span { font-size:14px; }


}

/* tablet */
@media screen and (min-width:768px) and (max-width:1024px) {
	h2.sub_tit {font-size: 3.125rem;}
	h3.sub_tit {font-size: 3.125rem;}

	#sub_visual .inner {width: 100%; padding: 0 30px;}
	#sub_visual .sub_txt {margin: 30px 0 0 30px;}
	#sub_visual .scroll_btn {right: 30px;}


	.sub_contents .inner {box-sizing: border-box; width: 100%; padding: 0 30px;}


	/* About */
	.about {padding: 70px 0;}
	.about .sub_con {padding: 30px 0;}
	.about .sub_con .con_tit {display: block; width: 100%; padding: 0; margin: 0 0 10px 0;}
	.about_avan .avan_title strong {line-height: 150px; font-size: 9.375rem;}
	.about_avan .avan_title strong:nth-child(2) {padding: 10px 0 0 280px;}
	.about_avan .avan_con01 {margin: 50px 0; height: 350px; background-size: cover;}
	.about_avan .avan_con01 div {width: 80%;}
	.about_avan .avan_con01 div strong {font-size: 2rem;}
	.about_avan .avan_con01 div p {padding: 30px 30px 0 0;}
	.about_avan .avan_con02 li {width: 450px;}
	.about_avan .avan_con02 li img {width: 100%; vertical-align: top;}
	.about_avan .avan_con02 li:nth-child(2) {width: calc(100% - 450px); height: 300px;}
	.about_avan .avan_con02 li div {left: auto; box-sizing: border-box; width: 100%; padding: 20px;}
	.about_avan .avan_con02 div strong {font-size: 2rem;}
	.about_avan .avan_con02 div p {padding: 20px 0 0 15px;}
	.about_goal .goal_con .con_tit {width: 20%;}
	.about_goal .goal_con .goal_list {width: 80%;}
	.about_service .sevice_list {padding: 0 60px 0 0; margin: 50px 0 0 0;}
	.about_service .sevice_list > li {height: auto; margin: 50px 0 0 0;}
	.about_service .sevice_list .img_box {position: relative; top: 0; transform: none; left: auto; right: 0; margin: 0 -30px -80px auto; text-align: right; z-index: 1;}
	.about_service .sevice_list .txt_box {width: 100%; height: auto;}
	.about_service .sevice_list .txt_wrap {position: static; left: auto; top: auto; transform: none; padding: 30px; margin: 30px 0 0 0;}
	.about_service .sevice_list li:nth-child(2n) .img_box {right: auto;}
	.about_service .sevice_list li:nth-child(2n) .txt_box {position: static;}
	.clients_list li {width: 33.333333%;}


	/* Project */
	.project_tab li {margin: 0 0 0 20px;}
	.project_list li {width: 49%;}
	.project_list li:nth-child(4n + 1) {margin: 0 0 2% 2%;}
	.project_list li:nth-child(2n + 1) {margin: 0 0 2% 0;}

	/* Project view */
	.project_title li.tit_arrow {margin: 0 70px;}
	.project_title li.prev_title, .project_title li.next_title {display: none;}



	/* News */
	.avanstoryCon ul li {width: 49%;}
	.avanstoryCon ul li:nth-child(3n + 1) {margin: 0 0 2% 2%;}
	.avanstoryCon ul li:nth-child(2n + 1) {margin: 0 0 2% 0;}


	/* Careers */
	.careers_txt ul li {float: none; width: 100%;}
	.job_content .support_btn {position: static; margin: 30px 0 0 0;}

	/* Careers popup */
	.support {width: 80%;}

	/* solution */
	.solutionDiv .solutionKind li {width:49%; margin-bottom:2%;}
	.solutionDiv .solutionKind li:nth-child(2n+2) {margin-right:0;}

	.sub_contents .inner2 {width:100%;}
	.solution_view01 .titArea .tit {padding-top:80px;}
	.solution_view01 .txtArea {top:-50px;}
	.solution_view01 .titArea img {top:-30px;}
	.solution_view01:before {width:100%; height:350px;}
	.solution_view01 .txtArea .btnArea a {width:30%;}
	.solution_view02 .txtArea .btnArea a {width:30%;}
	.solution_view03 .btnArea a {width:30%;}
	.solution_view03 .snsUl1 li {width:45%; margin:0 5px;}
	.solution_view03 .snsUl1 li .bgImg {width:100%;}
	.solution_view03 .snsUl2 li {margin-right:10px;}
	.solution_view04 .appUl li {margin-right:10px;}
	.solution_view04 .siteUl > li .imgArea {width:50%;}
	.solution_view04 .siteUl .txtArea {margin:0; width:45%; float:right;}
	.solution_view02 img {width:100%;}

	/* 쇼핑몰 얼리버스 예약 특전 */
	.shoppingmall_earlybus .image_box { height:280px; }
	.shoppingmall_earlybus .text_box { width:100%; }
	.shoppingmall_earlybus .text_box h6 { font-size:18px; }
	.shoppingmall_earlybus .text_box h6 b { font-size:20px; }
	.shoppingmall_earlybus .text_box p { font-size:15px; margin-top:5px; }
	.shoppingmall_earlybus .text_box h6 span { font-size:13px; }

 }


@media screen and (min-width:481px) and (max-width:767px) {
	h2.sub_tit {font-size: 2.429rem;}
	h3.sub_tit {font-size: 2.429rem;}

	.sub_txt {padding: 10px 0 10px 15px;}

	#sub_visual {height: 170px;}
	#sub_visual .inner {top: auto; bottom: 45px; width: 100%; padding: 0 30px;}
	#sub_visual h2.sub_tit {padding: 0 0 0 30px; border-left: 1px solid #0090e8;}
	#sub_visual .sub_txt {display: none;}
	#sub_visual .scroll_btn {display: none;}

	.sub_visual01 {background: url(../images/sub/m_sub_visual01.jpg) no-repeat center center / cover;}
	.sub_visual02 {background: url(../images/sub/m_sub_visual02.jpg) no-repeat center center / cover;}
	.sub_visual03 {background: url(../images/sub/m_sub_visual01.jpg) no-repeat center center / cover;}
	.sub_visual04 {background: url(../images/sub/m_sub_visual02.jpg) no-repeat center center / cover;}
	.sub_visual05 {background: url(../images/sub/m_sub_visual03.jpg) no-repeat center center / cover;}

	.sub_contents .inner {box-sizing: border-box; width: 100%; padding: 0 30px;}


	/* About */
	.about {padding: 50px 0;}
	.v_align {position: static; top: auto; transform: none;}

	.about .sub_con {padding: 0}
	.about .sub_con .con_tit {float: none; display: block; width: 100%; padding: 0; margin: 10px 0 0 0; font-size: 1rem;}
	.about .sub_con .sub_txt {display: none;}
	.about_avan .inner {padding: 0;}
	.about_avan .avan_title {padding: 0 30px;}
	.about_avan .avan_title strong {line-height: 70px; font-size: 5rem;}
	.about_avan .avan_title strong:nth-child(2) {padding: 0 0 0 100px;}
	.about_avan .avan_con01 {margin: 50px 0; height: 200px; background-size: contain;}
	.about_avan .avan_con01 div {width: calc(100% - 90px); right: auto; left: 30px;}
	.about_avan .avan_con01 div strong {padding: 0 0 20px 0; font-size: 1.571rem; letter-spacing: -0.5px; border-bottom-width: 1px;}
	.about_avan .avan_con01 div p {padding: 20px 0 0 0; text-align: left;}
	.about_avan .avan_con02 li {float: none;}
	.about_avan .avan_con02 li img {width: 70%; vertical-align: top;}
	.about_avan .avan_con02 li:nth-child(2) {width: 100%; height: auto;}
	.about_avan .avan_con02 li div {left: auto; box-sizing: border-box; width: 100%; padding: 30px 30px 30px 90px;}
	.about_avan .avan_con02 div strong {font-size: 2rem; border-bottom-width: 1px;}
	.about_avan .avan_con02 div p {padding: 20px 0 0 0;}
	.about_goal .goal_con .con_tit {width: 100%;}
	.about_goal .goal_con .goal_list {float: none; width: 100%; margin: 30px 0 0 0;}
	.about_goal .goal_con .goal_list li {margin: 30px 0 0 0;}
	.about_goal .goal_con .goal_list strong {padding: 15px; font-size: 1.143rem; border-left: 1px solid #0090e8;}
	.about_goal .goal_con .goal_list strong em {font-size: 1.143rem;}
	.about_goal .goal_con .goal_list .sub_txt {display: none;}
	.about_service .sevice_list {padding: 0 15px 0 0; margin: 30px 0 0 0;}
	.about_service .sevice_list > li {height: auto; margin: 30px 0 0 0;}
	.about_service .sevice_list .img_box {position: relative; top: 0; transform: none; left: auto; right: 0; width: 90%; margin: 0 auto -45px; z-index: 1;}
	.about_service .sevice_list .txt_box {width: 100%; height: auto;}
	.about_service .sevice_list li:nth-child(2n) .txt_box {position: static;}
	.about_service .sevice_list li:nth-child(2n) .img_box {position: relative; left: auto; right: auto;}
	.about_service .sevice_list .txt_wrap {position: static; left: auto; top: auto; transform: none; padding: 70px 30px 40px; margin: 20px 0 0 0;}
	.about_service .sevice_list .txt_wrap strong {font-size: 1.571rem;}
	.about_service .sevice_list .txt_wrap strong span {padding: 0 0 0 5px;}
	.about_service .sevice_list .txt_wrap em {font-size: 1rem;}
	.about_service .sevice_list .txt_wrap p {font-size: 0.8571rem;}
	.about_service .sevice_list .point_list {text-align: center;}
	.about_service .sevice_list .point_list li {float: none; display: inline-block; margin: 0 0 0 10px; width: 90px; height: 90px; background-size: cover; text-align: center;}
	.about_service .sevice_list .point_list li div {display: table; width: 90px; height: 90px;}
	.about_service .sevice_list .point_list li p {font-size: 0.8571rem; white-space: pre-line;}
	.about_service .sevice_list li:first-child .point_list {width: 300px; margin: 20px auto 0;}
	.about_service .sevice_list li:first-child .point_list li {margin: 0 0 10px 10px;}
	.about_service .sevice_list li:first-child .point_list li:first-child {margin: 0 0 10px 0;}
	.clients_list {margin: 40px 0 0 0;}
	.clients_list li {width: 50%; height: 80px; line-height: 80px;}

	.btn_box {margin: 30px 0 0 0; padding: 20px 0 0 0;}
	.btn_box .btn_more {font-size: 1rem;}


	/* Project */
	.project_tab {display: none;}
	.m_project_tab {display: block;}

	.project_list li {width: 49%;}
	.project_list li:nth-child(4n + 1) {margin: 0 0 2% 2%;}
	.project_list li:nth-child(2n + 1) {margin: 0 0 2% 0;}

	/* Project view */
	.project_title li.tit_arrow {margin: 0 10px;}
	.project_title li.prev_title, .project_title li.next_title {display: none;}
	.project_title li.title {font-size: 1.286rem;}
	.list_btn {margin: 50px auto;}



	/* News */
	.avanstoryCon ul li {float: none; width: 100%; margin: 0 0 30px 0;}
	.avanstoryCon ul li:nth-child(3n + 1) {margin: 0 0 30px 0;}
	.avanstoryCon .list_btn {margin: 50px auto;}


	/* Contact */
	.contact {padding: 70px 0 0 0;}
	.contact_Con .contact_ul01 {margin: 50px 0 0 0;}
	.contact_Con .contact_ul01 li {width: 100%; margin: 0;}
	.contact_Con .contact_ul01 .visit_radio {padding: 0;}
	.contact_Con .contact_ul01 .visit_radio span {width: 100%; padding: 0; margin: 0; border-bottom: 1px solid #e8e8e8;}
	.contact_Con .contact_ul01 .visit_radio span:after {display: none;}
	.contact_Con .contact_ul01 .visit_radio .input_wrap {box-sizing: border-box; width: 100%; padding: 0 10px;}
	.contact_Con .privacy_box li {float: none; width: 100%;}
	.avan_map iframe {height: 300px;}
   


	/* Careers */
	.top_box {margin: 0 0 70px 0;}
	.top_box .txt01 {line-height: 1.3; font-size: 1.714rem;}
	.top_box .txt02 {line-height: 1.3; font-size: 1.143rem;}
	.careers_txt {margin: 0 0 70px 0;}
	.careers {padding: 70px 0;}
	.careers_txt ul {padding: 20px 0;}
	.careers_txt ul li {float: none; box-sizing: border-box; width: 100%; padding: 20px; line-height: 1.7;}
	.careers_txt ul li span {display: block; margin: 0;}
	.careers_list li .job_content {padding: 50px 30px;}
	.job_content .pt {line-height: 1.3; font-size: 1.286rem;}
	.job_content .txt {line-height: 1.3; font-size: 1rem;}
	.job_content .txt .name02 {font-size: 1.143rem;}
	.job_content .name {font-size: 2rem;}
	.job_content .support_btn {position: static; margin: 30px 0 0 0;}



	/* popup */
	.popup .popup_wrap {width: 80%; height: auto;}
	.popup .popup_wrap strong {font-size: 1.429rem;}

	/* Careers popup */
	.support {width: 90%; height: 65%;}
	.support .close {top: -30px; right: 0; width: 20px; height: 20px;}
	.support .title {font-size: 1.714rem;}
	.support input[type=text] {width: 100%;}
	.support input[type=email] {width: 100%;}
	.support .filebox {width: 100%; margin-top: 15px;}
	.support form {width: 98%;}
	.support input[type=submit] {width: 180px; height: 50px; line-height: 50px;}

	/* solution */
	.solutionDiv .solutionKind li {width:49%; margin-bottom:2%; height:270px;}
	.solutionDiv .solutionKind li:nth-child(2n+2) {margin-right:0;}
	.solutionDiv .solutionKind li.kind1 .btnArea {display:none;}
	.solutionDiv .solutionKind li.kind1 .btnArea_m {display:block;}
	.solutionDiv .solutionKind li.kind1 {background:#f1f1f1}
	.solutionDiv .solutionKind li.kind2 {background:#f1f1f1}
	.solutionDiv .solutionKind li.kind3 {background:#f1f1f1}
	.solutionDiv .solutionKind li.kind4 {background:#f1f1f1}
	.solutionDiv .solutionKind li.kind1:hover {background:#0090e8;}
	.solutionDiv .solutionKind li.kind2:hover {background:#0090e8;}
	.solutionDiv .solutionKind li.kind3:hover {background:#0090e8;}
	.solutionDiv .solutionKind li.kind4:hover {background:#0090e8;}
	.solutionDiv .solutionKind li .tit {font-size:21px;}
	.solutionDiv .solutionKind li .txt {font-size:18px; margin-top:10px;}
	.solutionDiv .solutionKind li .btnArea button {font-size:13px;}

	.sub_contents .inner2 {width:100%;}
	.solution_view01 {padding:40px 0 0;}
	.solution_view01 .titArea .tit {padding-top:0;}
	.solution_view01 .titArea .tit p {color:#333; font-size:24px; }
	.solution_view01 .titArea .tit span {font-size:15px; color:#333;}
	.solution_view01 .txtArea {padding-bottom:50px; position:initial; top:0; }
	.solution_view01 .titArea img {position:initial; top:0px; margin-bottom:20px;}
	.solution_view01 .txtArea p {font-size:21px;}
	.solution_view01 .txtArea p span {font-size:15px;}
	.solution_view01 .txtArea .btnArea {text-align:center;}
	.solution_view01 .txtArea .btnArea a {width:30%; font-size:14px; height:40px; line-height:40px;}
	.solution_view01:before {display:none;}

	.solution_view02 img {width:100%; }
	.solution_view02 .txtArea p {font-size:18px; margin-top:30px;}
	.solution_view02 .txtArea p span {font-size:15px;}
	.solution_view02 .txtArea .btnArea a {width:30%; font-size:14px; height:40px; line-height:40px;}


	.solution_view03 {padding:60px 0;}
	.solution_view03 .snsImg p {font-size:40px; padding-top:60px;}
	.solution_view03 .snsImg {height:180px;}
	.solution_view03 .tit {font-size:21px}
	.solution_view03 .tit2 {font-size:18px; margin-top:30px;}
	.solution_view03 .tit2 span {font-size:15px;}
	.solution_view03 .snsUl1 {position:initial; top:0;}
	.solution_view03 .snsUl1 li {margin:0; width:100%; margin-bottom:30px;}
	.solution_view03 .snsUl1 li .bgImg {width:100%; height:150px;}
	.solution_view03 .snsUl1 li .bgImg p {font-size:25px; padding-top:60px;}
	.solution_view03 .snsUl1 li .txt span {font-size:16px; margin-bottom:10px;}
	.solution_view03 .snsUl1 li .txt {font-size:14px; }
	.solution_view03 .snsUl2 li {width:40%; margin:0 10px 20px;}
	.solution_view03 .snsUl2 li span {font-size:16px;}
	.solution_view03 .btnArea a {width:30%; font-size:14px; height:40px; line-height:40px;}

	.solution_view04 .bgImg {padding:80px 0; }
	.solution_view04 .bgImg span {font-size:28px;}
	.solution_view04 .appUl li {width:48%; margin-right:5px; margin-bottom:20px;}
	.solution_view04 .appUl .btnArea a {width:100%; margin-bottom:5px; font-size:14px;}
	.solution_view04 .siteUl > li {margin-bottom:50px;}
	.solution_view04 .siteUl > li > div {float:initial;}
	.solution_view04 .siteUl .txtArea {margin:30px 0 30px 0;}
	.solution_view04 .siteUl .txtArea p span {font-size:21px;}
	.solution_view04 .siteUl .txtArea p {font-size:14px;}
	.solution_view04 .siteUl .txtArea .viewBtn {width:100%; height:40px; line-height:40px; font-size:14px;}

	#sub_visual.sub_visual06 h3 { font-size:30px; }

	/* 쇼핑몰 얼리버스 예약 특전 */
	.shoppingmall_earlybus { padding-top:50px; }
	.shoppingmall_earlybus ul,
	.shoppingmall_earlybus ul li { width:100%; margin:10px 0; }
	.shoppingmall_earlybus .tit { font-size:30px; }
	.shoppingmall_earlybus .image_box { height:50vw; }
	.shoppingmall_earlybus .text_box { width:100%; }
	.shoppingmall_earlybus .text_box > div { left:15px; }
	.shoppingmall_earlybus .text_box h6 { font-size:16px; }
	.shoppingmall_earlybus .text_box h6 b { font-size:18px; }
	.shoppingmall_earlybus .text_box p { font-size:14px; margin-top:5px; }
	.shoppingmall_earlybus .text_box h6 span { font-size:12px; }

}


/* mobile */
@media screen and (max-width:480px) {
	h2.sub_tit {font-size: 2.429rem;}
	h3.sub_tit {font-size: 2.429rem;}

	.sub_txt {padding: 10px 0 10px 15px;}

	#sub_visual {height: 170px;}
	#sub_visual .inner {top: auto; bottom: 45px; width: 100%; padding: 0 15px;}
	#sub_visual h2.sub_tit {padding: 0 0 0 15px; border-left: 1px solid #0090e8;}
	#sub_visual .sub_txt {display: none;}
	#sub_visual .scroll_btn {display: none;}

	.sub_visual01 {background: url(../images/sub/m_sub_visual01.jpg) no-repeat center center / cover;}
	.sub_visual02 {background: url(../images/sub/m_sub_visual02.jpg) no-repeat center center / cover;}
	.sub_visual03 {background: url(../images/sub/m_sub_visual01.jpg) no-repeat center center / cover;}
	.sub_visual04 {background: url(../images/sub/m_sub_visual02.jpg) no-repeat center center / cover;}
	.sub_visual05 {background: url(../images/sub/m_sub_visual03.jpg) no-repeat center center / cover;}

	.sub_contents .inner {box-sizing: border-box; width: 100%; padding: 0 15px;}

	.about {padding: 50px 0;}
	.v_align {position: static; top: auto; transform: none;}


	.about .sub_con {padding: 0}
	.about .sub_con .con_tit {float: none; display: block; width: 100%; padding: 0; margin: 0 0 30px 0; font-size: 1rem;}
	.about .sub_con .sub_txt {display: none;}
	.about_avan .inner {padding: 0;}
	.about_avan .avan_title {padding: 0 15px;}
	.about_avan .avan_title strong {line-height: 70px; font-size: 5rem;}
	.about_avan .avan_title strong:nth-child(2) {padding: 0 0 0 80px;}
	.about_avan .avan_con01 {margin: 50px 0; height: 140px; background-size: contain;}
	.about_avan .avan_con01 div {width: calc(100% - 60px); right: auto; left: 15px;}
	.about_avan .avan_con01 div strong {padding: 0 0 20px 0; font-size: 1.571rem; letter-spacing: -0.5px; border-bottom-width: 1px;}
	.about_avan .avan_con01 div p {padding: 20px 0 0 0; text-align: left;}
	.about_avan .avan_con02 li {float: none;}
	.about_avan .avan_con02 li img {width: 70%; vertical-align: top;}
	.about_avan .avan_con02 li:nth-child(2) {width: 100%; height: auto;}
	.about_avan .avan_con02 li div {left: auto; box-sizing: border-box; width: 100%; padding: 15px 15px 15px 45px;}
	.about_avan .avan_con02 div strong {font-size: 2rem; border-bottom-width: 1px;}
	.about_avan .avan_con02 div p {padding: 20px 0 0 0;}
	.about_goal .goal_con .con_tit {width: 100%;}
	.about_goal .goal_con .goal_list {float: none; width: 100%; margin: 30px 0 0 0;}
	.about_goal .goal_con .goal_list li {margin: 30px 0 0 0;}
	.about_goal .goal_con .goal_list strong {padding: 15px; font-size: 1.143rem; border-left: 1px solid #0090e8;}
	.about_goal .goal_con .goal_list strong em {font-size: 1.143rem;}
	.about_goal .goal_con .goal_list .sub_txt {display: none;}
	.about_service .sevice_list {padding: 0 15px 0 0; margin: 30px 0 0 0;}
	.about_service .sevice_list > li {height: auto; margin: 30px 0 0 0;}
	.about_service .sevice_list .img_box {position: relative; top: 0; transform: none; left: auto; right: 0; width: 90%; margin: 0 auto -45px; z-index: 1;}
	.about_service .sevice_list .txt_box {width: 100%; height: auto;}
	.about_service .sevice_list li:nth-child(2n) .txt_box {position: static;}
	.about_service .sevice_list li:nth-child(2n) .img_box {position: relative; left: auto; right: auto;}
	.about_service .sevice_list .txt_wrap {position: static; left: auto; top: auto; transform: none; padding: 40px 15px 30px; margin: 20px 0 0 0;}
	.about_service .sevice_list .txt_wrap strong {font-size: 1.571rem;}
	.about_service .sevice_list .txt_wrap strong span {padding: 0 0 0 5px;}
	.about_service .sevice_list .txt_wrap em {font-size: 1rem;}
	.about_service .sevice_list .txt_wrap p {font-size: 0.8571rem;}
	.about_service .sevice_list .point_list {text-align: center;}
	.about_service .sevice_list .point_list li {float: none; display: inline-block; margin: 0 0 0 5px; width: 60px; height: 60px; background-size: cover; text-align: center;}
	.about_service .sevice_list .point_list li div {display: table; width: 60px; height: 60px;}
	.about_service .sevice_list .point_list li p {font-size: 0.8571rem; white-space: pre-line;}
	.about_service .sevice_list li:first-child .point_list {width: 210px; margin: 20px auto 0;}
	.about_service .sevice_list li:first-child .point_list li {margin: 0 0 10px 10px;}
	.about_service .sevice_list li:first-child .point_list li:first-child {margin: 0 0 10px 0;}
	.clients_list li {width: 50%; height: 80px; line-height: 80px;}

	.btn_box {margin: 30px 0 0 0; padding: 20px 0 0 0;}
	.btn_box .btn_more {font-size: 1rem;}




	/* Project */
	.project {padding: 50px 0;}
	.project_tab {display: none;}
	.m_project_tab {display: block;}

	.project_list li {width: 49%;}
	.project_list li:nth-child(4n + 1) {margin: 0 0 2% 2%;}
	.project_list li:nth-child(2n + 1) {margin: 0 0 2% 0;}

	/* Project view */
	.project_title li.tit_arrow {margin: 0 10px;}
	.project_title li.prev_title, .project_title li.next_title {display: none;}
	.project_title li.title {font-size: 1.286rem;}
	.top_visual {height: 300px;}
	.top_visual .visual_txtwrap {padding: 60px 15px;}
	.top_visual .visual_txtwrap .txt01 {padding: 30px 0 0 0; font-size: 2.143rem;}
	.top_visual .visual_txtwrap .txt01:after {width: 60px; height: 1px; margin: 20px auto;}
	.list_btn {margin: 50px auto;}



	/* News */
	.avanstoryCon {padding: 50px 0 0 0;}
	.avanstoryCon ul li {float: none; width: 100%; margin: 0 0 15px 0;}
	.avanstoryCon ul li:nth-child(3n + 1) {margin: 0 0 15px 0;}

	.avanstoryCon .next_post, .avanstoryCon .prev_post {padding: 0 20px;}
	.avanstoryCon .list_btn {margin: 50px auto;}



	/* Contact */
	.contact {padding: 50px 0 0 0;}
	.contact_Con .contact_ul01 {margin: 50px 0 0 0;}
	.contact_Con .contact_ul01 li {width: 100%; margin: 0;}
	.contact_Con .contact_ul01 .visit_radio {padding: 0;}
	.contact_Con .contact_ul01 .visit_radio span {width: 100%; padding: 0; margin: 0; border-bottom: 1px solid #e8e8e8;}
	.contact_Con .contact_ul01 .visit_radio span:after {display: none;}
	.contact_Con .contact_ul01 .visit_radio .input_wrap {box-sizing: border-box; width: 100%; padding: 0 10px;}

	.contact_Con .privacy_box li {float: none; width: 100%;}
	.contact_Con .privacy_box .privacy_check {margin: 20px 0 0 0;}
	.contact_Con .send_btn {margin: 50px auto;}
	.avan_map iframe {height: 300px;}


	/* Careers */
	.top_box {margin: 0 0 50px 0;}
	.top_box .txt01 {line-height: 1.3; font-size: 1.714rem;}
	.top_box .txt02 {line-height: 1.3; font-size: 1.143rem;}
	.careers_txt {margin: 0 0 50px 0;}
	.careers {padding: 50px 0;}
	.careers_txt ul {padding: 20px 0;}
	.careers_txt ul li {float: none; box-sizing: border-box; width: 100%; padding: 20px; line-height: 1.7;}
	.careers_txt ul li span {display: block; margin: 0;}
	.careers_list li .job {padding: 30px 20px;}
	.careers_list li .job_content {padding: 30px 20px;}
	.job_content .pt {line-height: 1.3; font-size: 1.286rem;}
	.job_content .txt {line-height: 1.3; font-size: 1rem;}
	.job_content .txt .name02 {font-size: 1.143rem;}
	.job_content .name {font-size: 2rem;}
	.job_content .support_btn {position: static; margin: 30px 0 0 0;}



	/* popup */
	.popup .popup_wrap {width: 90%; height: auto;}
	.popup .popup_wrap strong {font-size: 1.429rem;}

	/* Careers popup */
	.support {width: 90%; height: 65%;}
	.support .close {top: -30px; right: 0; width: 20px; height: 20px;}
	.support .title {font-size: 1.714rem;}
	.support input[type=text] {width: 100%;}
	.support input[type=email] {width: 100%;}
	.support .filebox {width:100%; margin-top:15px;}
	.support form {width: 98%;}
	.support input[type=submit] {width: 180px; height: 50px; line-height: 50px;}

	/* solution */
	.solutionDiv {margin:50px 0;}
	.solutionDiv .solutionKind li {width:100%; margin-bottom:2%; height:180px;}
	.solutionDiv .solutionKind li:nth-child(2n+2) {margin-right:0;}
	.solutionDiv .solutionKind li.kind1 {background:#f1f1f1}
	.solutionDiv .solutionKind li.kind1 .btnArea {display:none;}
	.solutionDiv .solutionKind li.kind1 .btnArea_m {display:block;}
	.solutionDiv .solutionKind li.kind2 {background:#f1f1f1}
	.solutionDiv .solutionKind li.kind3 {background:#f1f1f1}
	.solutionDiv .solutionKind li.kind4 {background:#f1f1f1}
	.solutionDiv .solutionKind li.kind1:hover {background:#0090e8;}
	.solutionDiv .solutionKind li.kind2:hover {background:#0090e8;}
	.solutionDiv .solutionKind li.kind3:hover {background:#0090e8;}
	.solutionDiv .solutionKind li.kind4:hover {background:#0090e8;}
	.solutionDiv .solutionKind li .tit {font-size:21px; padding:30px 0 0;}
	.solutionDiv .solutionKind li .txt {font-size:18px; margin-top:10px;}
	.solutionDiv .solutionKind li .btnArea button {font-size:13px;}
	.solutionDiv .solutionKind li:hover .moreBtn {display:none;}

	.sub_contents .inner2 {width:100%;}
	.solution_view01 {padding:40px 0 0;}
	.solution_view01 .titArea .tit {padding-top:0;}
	.solution_view01 .titArea .tit p {color:#333; font-size:24px; }
	.solution_view01 .titArea .tit span {font-size:15px; color:#333;}
	.solution_view01 .txtArea {padding-bottom:50px; position:initial; top:0; }
	.solution_view01 .titArea img {position:initial; top:0px; margin-bottom:20px;}
	.solution_view01 .txtArea p {font-size:21px;}
	.solution_view01 .txtArea p span {font-size:15px;}
	.solution_view01 .txtArea .btnArea {text-align:center;}
	.solution_view01 .txtArea .btnArea a {width:30%; font-size:14px; height:40px; line-height:40px;}
	.solution_view01:before {display:none;}

	.solution_view02 img {width:100%; }
	.solution_view02 .txtArea p {font-size:18px; margin-top:30px;}
	.solution_view02 .txtArea p span {font-size:15px;}
	.solution_view02 .txtArea .btnArea a {width:30%; font-size:14px; height:40px; line-height:40px;}


	.solution_view03 {padding:60px 0;}
	.solution_view03 .snsImg p {font-size:40px; padding-top:60px;}
	.solution_view03 .snsImg {height:180px;}
	.solution_view03 .tit {font-size:21px}
	.solution_view03 .tit2 {font-size:18px; margin-top:30px;}
	.solution_view03 .tit2 span {font-size:15px;}
	.solution_view03 .snsUl1 {position:initial; top:0;}
	.solution_view03 .snsUl1 li {margin:0; width:100%; margin-bottom:30px;}
	.solution_view03 .snsUl1 li .bgImg {width:100%; height:150px;}
	.solution_view03 .snsUl1 li .bgImg p {font-size:25px; padding-top:60px;}
	.solution_view03 .snsUl1 li .txt span {font-size:16px; margin-bottom:10px;}
	.solution_view03 .snsUl1 li .txt {font-size:14px; }
	.solution_view03 .snsUl2 li {width:30%; margin:0 5px 20px;}
	.solution_view03 .snsUl2 li span {font-size:16px;}
	.solution_view03 .btnArea a {width:30%; font-size:14px; height:40px; line-height:40px; min-width:120px; }

	.solution_view04 .bgImg {padding:80px 0; }
	.solution_view04 .bgImg span {font-size:28px;}
	.solution_view04 .appUl li {width:48%; margin-right:5px; margin-bottom:20px;}
	.solution_view04 .appUl .btnArea a {width:100%; margin-bottom:5px; font-size:14px;}
	.solution_view04 .siteUl > li {margin-bottom:50px;}
	.solution_view04 .siteUl > li > div {float:initial;}
	.solution_view04 .siteUl .txtArea {margin:30px 0 30px 0;}
	.solution_view04 .siteUl .txtArea p span {font-size:21px;}
	.solution_view04 .siteUl .txtArea p {font-size:14px;}
	.solution_view04 .siteUl .txtArea .viewBtn {width:100%; height:40px; line-height:40px; font-size:14px;}

	/* 쇼핑몰 얼리버스 예약 특전 */
	#sub_visual.sub_visual06 h3 { font-size:26px; }
	.shoppingmall_earlybus { padding-top:50px; }
	.shoppingmall_earlybus ul,
	.shoppingmall_earlybus ul li { width:100%; margin:10px 0; }
	.shoppingmall_earlybus .tit { font-size:26px; }
	.shoppingmall_earlybus .image_box { height:240px; }
	.shoppingmall_earlybus .text_box { width:100%; height:auto; min-height:90px; }
	.shoppingmall_earlybus .text_box > div { left:15px; }
	.shoppingmall_earlybus .text_box h6 { font-size:16px; }
	.shoppingmall_earlybus .text_box h6 b { font-size:18px; }
	.shoppingmall_earlybus .text_box p { font-size:14px; margin-top:5px; }
	.shoppingmall_earlybus .text_box h6 span { font-size:12px; }
}
