*{margin:0; padding:0; box-sizing:border-box; font-family: 'Noto Sans KR', sans-serif;}
body{color:#151515; line-height: 1.4em; height:auto;}
a{color:#151515; text-decoration:none;}
ul{list-style: none;}
img{border:0; max-width: 100%;}
.txtblue{color:#003766;}
.clear{clear: both;}
#wrap{width:100%; margin:0 auto; overflow:hidden;}








header{width:100%; height:80px; position: fixed; left:0; top:0;
    background:url('/base/img/rerenewal_img/header_bg.png') no-repeat center center; background-size: cover; z-index: 999;}
.headerbox{width:75%; margin: 0 auto; padding-top:19px;}
#menu{float: left; margin-top:10px; cursor: pointer;}
#logo{float: right; margin-top:4px; }
#logo2{text-align: center; margin-top:4px; }
nav{position: fixed; left:0; top:0; height:100%; width:30%;
    background:#fff; padding-top:40px; padding-left: 40px;
    z-index:9999; overflow: auto; display: none;}
.navline{background-color: #dee4e8; width:100%; height: 2px; margin-bottom: 35px; }
.menubox{margin-top: 50px; margin-left: 50px;}
.menubox li{font-size: 25px; margin-bottom: 35px; font-weight: bold;}
.contact li:last-child a{color:#3c5366;}
.menubox li a:hover {text-transform: lowercase;}
/*Çì´õ&¸Þ´º³¡*/








#firstmain{width:100%; height: 100vh; margin: 0 auto; overflow:hidden; position: relative;}
/*.mainImagebox{background-color: #3c5366; position: absolute; top: 0px; left: 0px; width: auto; height: 100vh;
    z-index: -1;}
.mainImage{object-fit: fill;}*/
.video_box{padding: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    position: absolute;}
.videomain{z-index: -1;
    width: 100vw;
    height: 100vh;
    position: absolute;
    object-fit: cover;}
.firstmaintxtbox {width: 75%; text-align: right; position: absolute; left:50%; bottom:17%; transform:translateX(-50%);}
.firstmaintxtbox h1 {font-size: 60px; font-weight: 700; margin-bottom: 30px;}
.firstmaintxtbox h2 {font-size: 80px; font-weight: 900; padding-top: 30px; margin-bottom: 80px;}
.firstmaintxtbox h3 {font-size: 40px; font-weight: bolder; padding-top: 80px; }
.firstmaintxtbox p{padding-top: 30px; margin-bottom: 80px; display: none;}
/*¸ÞÀÎÆäÀÌÁö³¡*/








#rollingbox{margin: 0; width:100%; height:auto; overflow: hidden;}
#rollingtitlebox{width: 70%; background: url('/base/img/rerenewal_img/only_bg.png') no-repeat; background-position: center; 
    background-size: cover; margin-top: 125px; height: 260px; margin-left: 0; text-align: left; }
.rollingtitle{width:60%; font-size: 50px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
.rollingtitle_m{display: none;}
#rollingmaintxtbox{width:70%; height: auto; margin:0 auto; text-align: right; box-sizing: border-box; margin-top:20px;}
#rollingmaintxtbox div {width:auto; height:100%; box-sizing: border-box; display: inline-block; font-size: 25px; font-weight: bold; margin-left: 10px;}
.rollingmaintxt2{min-width:385px;}
.textt1{font-size: 270px; font-style: italic; font-family: 'Lobster', cursive;}
#main_rolling{width:70%; height: auto; margin:0 auto; margin-bottom:30px;}
.rolling{float: left; text-align: center; width: 25%; margin-top: 130px;}
.rolling img{margin-bottom:23px;}
.rolling h1{font-size: 50px;}
.rolling_p{font-size: 17px; margin-top:30px;}
.rolling_p_1, .rolling_p_3{display: none;}
/*·Ñ¸µÆäÀÌÁö³¡*/








#onetoone{margin: 0; width:100%; height:auto; overflow: hidden; margin-top: 200px;}
#onetoonebox{width:100%; height:auto; background:url('/base/img/rerenewal_img/onetoone_bg2.jpg') no-repeat 0 0; background-size:cover; background-attachment:fixed;
    text-align: center; color: #fff; padding: 95px 0 145px 0;}
#onetoonebox p{font-size: 30px; font-weight: bold; margin-bottom: 70px;}
#onetoonebox h1{font-size: 120px;}
#difference{width:100%; margin: 0 auto;}
.title1{font-size: 55px; font-weight: bold; margin-top: 150px; text-align: center; padding:0;}
.titlediff{line-height:1.2em;}
.titlediff_m{display: none;}
.difftxt1{margin-top: 70px; font-size: 22px; font-weight: bold; text-align: center; text-decoration: underline; text-underline-position:under;}
.difftxt2{margin-top:65px; font-size: 17px; line-height: 1.5em; text-align: center; }
.difftxt_m{display: none;}
.difftxt2_m{display: none;}
#diffimageboxwrap{width: 1076px; margin: 0 auto; margin-top: 120px;}
#diffimageboxwrap2{width: 100%; margin: 0 auto;}
#diffimageboxwrap2 div{float: left;}
#diffimageboxwrap3 div{float: left;}
.diffimagebox{width: 280px; height: 270px; position: relative; margin-right:118px; opacity: 0;}
.diffimagebox3, .diffimagebox6{margin-right: 0;}
.diffimgsmallwrap1{position:absolute; top: 0; left: 0;}
.diffimgsmallwrap1 p{text-align: center; font-size: 17px; margin-top: 10px;}
.arrow1{position:absolute; bottom: 0; right: 0;}
.diffimgsmallwrap2{position:absolute; top: 0; left: 20px;}
.diffimgsmallwrap2 p{text-align: center; font-size: 17px; margin-top: 10px;}
.arrow2{position:absolute; bottom: 0; left: 50%; transform: translate(-50%,0);}
.diffimgsmallwrap3{position:absolute; top: 0; right: 0;}
.diffimgsmallwrap3 p{text-align: center; font-size: 17px; margin-top: 10px;}
.arrow3{position:absolute; bottom: 0; left: 0;}
.diffimgsmallwrap4{position:absolute; bottom: 0; left: 0;}
.diffimgsmallwrap4 p{text-align: center; font-size: 17px; margin-top: 10px;}
.arrow4{position:absolute; top: 0; right: 0;}
.diffimgsmallwrap5{position:absolute; bottom: 0; left: 20px;}
.diffimgsmallwrap5 p{text-align: center; font-size: 17px; margin-top: 10px;}
.arrow5{position:absolute; top: 0; left: 50%; transform: translate(-50%,0);}
.diffimgsmallwrap6{position:absolute; bottom: 0; right: 0;}
.diffimgsmallwrap6 p{text-align: center; font-size: 17px; margin-top: 10px;}
.arrow6{position:absolute; top: 0; left: 0;}
.diffimagecenter{text-align: center; margin-top: 20px; margin-bottom: 20px;}
.arrow1, .arrow6{width:20px; height: auto;}
.arrow2, .arrow5{width:17px; height: auto;}
.arrow3, .arrow4{width:24.4px; height: auto;}
/*onetoone 6°³ ³¡*/





#onestop{padding-top:100px; overflow:hidden;}
.onecircle_m_h, .onecircle_m{font-size: 17px; text-align: center; margin-top: 77px;}
.onecircle_m{display: none;}
.onestopimagewrap{margin: 0 auto; margin-top: 80px; width: 1076px; height: 1520px; overflow: hidden;}
.otomarketing_title{margin: 0 auto; padding-top: 30px; width:1076px; height: 150px; background:url('/base/img/rerenewal_img/OnetoOne_marketing_Tiitle.jpg') no-repeat center center;}
.otomarketing1{font-family: 'Noto Serif', serif; font-size: 20px; margin-left: 30px;}
.otomarketing2{font-family: 'Noto Serif', serif; font-size: 40px; margin-top: 15px; margin-left: 30px;}
.otoRD_title{margin: 0 auto; margin-top:100px; padding-top: 30px; width:1076px; height: 150px; background:url('/base/img/rerenewal_img/OnetoOne_RD_Tiitle.jpg') no-repeat center center;}
.otoRD1{font-family: 'Noto Serif', serif; font-size: 20px; margin-left: 30px;}
.otoRD2{font-family: 'Noto Serif', serif; font-size: 40px; margin-top: 15px; margin-left: 30px;}
.otodevelop_title{margin: 0 auto; margin-top:100px; padding-top: 30px; width:1076px; height: 150px; background:url('/base/img/rerenewal_img/OnetoOne_develope_Tiitle.jpg') no-repeat center center;}
.otodevelop1{font-family: 'Noto Serif', serif; font-size: 20px; margin-left: 30px;}
.otodevelop2{font-family: 'Noto Serif', serif; font-size: 40px; margin-top: 15px; margin-left: 30px;}
.otoimagebox{margin: 0 auto; margin-top: 50px; width: 1076px;}
.otoimagebox1{float: left; text-align: center; margin-right: 170px; width:245px; opacity: 0;}
.otoimagebox1 p {margin-top: 10px;}
.onetoonemarketing_smallwrap3, .onetooneRD_smallwrap3, .onetoonedevelop_smallwrap3 {margin-right:0;}
/*onetoone 3´Ü ³¡*/




.show_m{display:none; margin: 0; width:100%; height:auto; overflow: hidden;}
#diffbox_m{margin: 0 auto; text-align: center; width: 400px;}
.diffimg_m1{margin-top: 35px;}
.diffimg_m2{margin-bottom: 25px;}
.diffimagecenter_m{width: 400px; height: auto;}
.oneimg1_m, .oneimg2_m, .oneimg3_m {width:400px; margin: 0 auto; margin-bottom: 5px;}
/*onetoone ¸ð¹ÙÀÏ*/




#oneservice{margin: 0; width:100%; height:auto; overflow: hidden; margin-top: 100px;}
.servicewrap{width:992px; height:491px; margin: 0 auto; margin-top:77px; position: relative; overflow: hidden;}
.serviceimage{position: absolute; left: -900px;}
.servicetxtbox{position: absolute; right: -900px; top: 71.5px; width:533px; height:348px; background-color: rgba( 255, 255, 255, 0.6 );}
.servicetxt{margin-top:65px; font-size: 17px; line-height: 1.5em; text-align: center;}
.servicewrap_m{width:90%; height: auto; background:url('/base/img/rerenewal_img/oneproduct_m.jpg') no-repeat center center; background-size:cover;
    margin:0 auto; margin-top:77px; padding:65px 40px 65px 40px; display: none;}
.servicetxtbox_m{background-color: rgba( 255, 255, 255, 0.6 ); display: none;}
.servicetxt_m{text-align: center; font-size: 16px; line-height: 1.4em; padding:50px 35px 50px 35px; display: none;}
/*oneservice*/




#works{margin: 0 auto; padding-top: 300px; width: 100%; height: auto; overflow:hidden;}
#worktitlebox{width:100%; height:auto; background:url('/base/img/rerenewal_img/oneproduct_titlebg.jpg') no-repeat center center; background-size:cover; background-attachment:fixed;
    text-align: center; padding: 82px 0;}
.focus{width:65%; padding: 35px; margin: 0 auto; margin-top:100px; text-align: right;
    background:url('/base/img/rerenewal_img/works_bg.png') no-repeat center center; background-size: cover;}
.focustxt{margin-top: 50px; margin-bottom: 20px; font-size: 18px; font-weight: 400;}
.focustitle{font-family: 'Noto Serif', serif; font-size: 45px; line-height: 1em;}
.productslide{width:900px; height: 410px; margin: 0 auto; background: #003766; margin-top: 120px; position: relative;}
.productslidewrap{width: 100%; height: 100%;
    background:url('/base/img/rerenewal_img/slide_line1.png'), url('/base/img/rerenewal_img/slide_line2.png'), url('/base/img/rerenewal_img/slide_line3.png');
    background-repeat: repeat-x, repeat-y, repeat-x;
    background-position: top, right, bottom;}
.productslidewrap:after {content: ''; display: block; clear: both;}
.productslidewrap li{position: absolute; top: 0; left: 0; display: none; width: 100%; height: 100%;}
.productslidewrap li:nth-child(1){display: block;}
.productimg{width: 380px; height: auto; border: 13px solid #fff; position: absolute; top: -50px; left: -50px;}
.producttxtbox{position: absolute; top: 80px; left: 370px;}
.producttitle{font-size: 40px; color: #fff; font-weight: bold;}
.producttitle2{font-size: 25px; color: #fff; font-weight: 400; margin-top: 25px;}
.producttxt{font-size: 16px; color: #fff; line-height: 1.6em;}
.producttxtline{margin-top:50px; margin-bottom: 20px;}
.toggle{position: absolute; bottom: 40px; right: 40px;}
.prev{margin-right: 15px;}
.smallworkswrap{width:65%; margin:0 auto; margin-top:90px;}
.smallworkswrap li{float:left; width:23.25%; margin:0; margin-right:2.33%; margin-top:2.33%; padding:0; font-size:0;line-height:0;}
.smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(8), .smallworkswrap li:nth-child(12){margin-right:0;}
.smallworks{width:100%; height:auto; overflow:hidden; position: relative; 
    margin:0; padding:0;}
.smallworks img{width:100%; height:auto;  margin:0; padding:0; display:block;}
.works_mouseon{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;


    display:flex;
    justify-content:center;
    align-items:center;


    background: url('/base/img/rerenewal_img/smallpro_mouseon.png'); background-size: cover;


    opacity:0;
    transition:0.3s;
}
.works_ontxt{height:100%; padding:0 15px; text-align: center; align-content: center; font-size: 18px; line-height: 1.2em; color:#fff;}
.works_ontxttitle{font-size: 22px; line-height: 1.6em;}
.smallworks:hover .works_mouseon{
    opacity:1;
}
.smallworks.active .works_mouseon{
    opacity:1;
}
/*Æ÷Æú*/








#oemprocess{padding-top:300px; overflow:hidden;}
#processtitlebox{width:100%; height:auto; background:url('/base/img/rerenewal_img/process_bg.jpg') no-repeat 0 0; background-size:cover; background-attachment:fixed;
    text-align: center; padding: 82px 0;}
.title2{font-size: 55px; font-weight: bold;}
.processwrap{background:url('/base/img/rerenewal_img/process_line2.png') no-repeat center center; height: 2634px; width: 829px;
    margin: 0 auto; margin-top: 100px; position: relative;}
.processimg{font-size: 15px;}
.processimg img{margin-top: 10px; margin-bottom: 10px;}
.processimgtitle{font-size: 20px; font-weight: 500;}
.processimgtitlenum{font-size: 28px;}
.processimg1{position: absolute; top:146px; left:534px;}
.processimg2{position: absolute; top:413px; left:21px;}
.processimg3{position: absolute; top:679px; left:534px;}
.processimg4{position: absolute; top:946px; left:21px;}
.processimg5{position: absolute; top:1212px; left:534px;}
.processimg6{position: absolute; top:1479px; left:21px;}
.processimg7{position: absolute; top:1746px; left:534px;}
.processimg8{position: absolute; top:2013px; left:21px;}
.processimg9{position: absolute; top:2280px; left:534px;}
/*ÇÁ·Î¼¼½º*/








#development{padding-top:115px; height:auto; overflow: hidden;}
.developwrap{width:70%; margin: 0 auto; margin-top:100px;}
.developboxwrap{width:100%;}
.developbox{width:15%; margin-right: 2%; margin-top:50px; float: left;}
.developbox6{margin-right: 0;}
.developimg{text-align: center; line-height: 0;}
.developtitle{font-size: 20px; font-weight: 500; text-align: center; margin-top: 28px; margin-bottom: 35px;}
.developtitle1{font-size: 20px; font-weight: 500; text-align: center; margin-top: 28px; margin-bottom: 35px;}
.developtitle2{font-size: 20px; font-weight: 500; text-align: center; margin-top: 28px; margin-bottom: 15px; display: none;}
.developtxt{font-size: 17px; line-height: 1.8em; text-align: center;}
/*°³¹ßÇ°¸ñ*/









#faq{width: 100%; height: auto; margin: 0 auto; padding-top: 150px; overflow:hidden;}
#faqwrap{width: 65%; height: auto; min-height: 430px; margin: 0 auto; margin-top: 100px;}
.faq_titlebox{margin: 0 auto; margin-bottom: 100px; padding-top: 30px; width:100%; height: 150px; background:url('/base/img/rerenewal_img/faq_title_bg.jpg') no-repeat center center; background-size:cover;}
.faq_title1{font-family: 'Noto Serif', serif; font-size: 20px; margin-left: 30px;}
.faq_title2{font-size: 40px; margin-top: 15px; margin-left: 30px;}
.faqtxtbox{width: 80%; height: auto; margin: 0 auto;}
.answer li {width: 45%; margin: 0 2.5%; margin-bottom: 35px; float: left;}
.answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {width: 100%; height: 55px;
    padding: 14px 0; padding-left: 30px; border: 2px solid #003766; background-color: #003766; font-size: 18px; color: #fff;}
.answernum{font-size: 22px; font-weight: 500; color: #fff;}
.answertxt{width: 100%; height: 380px; background-color: #f0f5f8; padding:0 38px; padding-top: 48px;
    font-size: 14px; line-height: 1.6em;}
.answertxt5, .answertxt6{height:410px;}
.txt5img{text-align: center; margin-top: 25px;}
.answer2box{border: 2px solid #003766; padding:14px; margin-top: 25px; font-size: 13px;}
.faq_m{display: none;}
.questionbtn{float: right; margin-right:20px;}
.answerbtn{float: right; margin-right:20px;}
/*faq*/









#gocontact{width:100%; height:auto; margin: 0 auto; margin-top: 300px; margin-bottom: 260px; text-align: center; }
.title2{font-size: 55px; font-weight: bold;}
#contacttitlebox{width:100%; height:auto; background:url('/base/img/rerenewal_img/contact_bg.jpg') no-repeat 0 0; background-size:cover; background-attachment:fixed;
    text-align: center; padding: 82px 0;}
.contacttxt{margin-top:100px; font-size: 17px; line-height: 1.5em; text-align: center; margin-bottom: 100px;}
.contacttxt_m{display: none;}
.contactthingbox{width:65%; margin: 0 auto;}
.contactimg{width: 49.5%; height: 500px; float: left; 
    background: url('/base/img/rerenewal_img/contact_photo.jpg') no-repeat center center; background-size: cover; overflow: hidden;}
.contact_context{width: 49.5%; height: 500px; margin-left: 1%; float: left;}
.contact_context img{margin-bottom: 10px;}
.contact_loca{float: left; width:49.5%; height:245px; padding-top: 40px; border-right: solid 2px #003766;}
.contact_time{float: left; width:49.5%; height:245px; padding-top: 40px;}
.contact_mail{width:100%; height: 245px; margin-top:10px; padding-top: 40px; border-top: solid 2px #003766; background-color: #f0f5f8;}
.loca_title, .time_title, .mail_title{margin-bottom: 15px; font-size: 25px;}
.loca_txt, .time_txt, .mail_txt{margin-bottom: 10px;}


#contactbtn{width:160px; height: auto; position: fixed; bottom:150px; left:50px; z-index: 9997; cursor: pointer;}
/*¸ÞÀÎÆäÀÌÁöÄÁÅÃÆ®*/








#call_2{width:100%; height:auto; overflow: hidden; text-align: center;}




#contact_2{width:100%; height:auto; background:url('/base/img/rerenewal_img/contact_bg.jpg') no-repeat center -250px; background-size:cover; 
    background-attachment:fixed; text-align: center; padding: 82px 0; margin: 0 auto; margin-top: 100px;}
.contact_title{font-size: 40px; font-weight: 500; line-height: 1em; margin-bottom: 50px;}
#location{margin-top:100px; padding-top:100px;}
.locationbox{width:75%; margin: 0 auto;}
#contact{margin-top:100px; padding-top:100px;}
.contacttxt{font-size: 17px; margin-bottom: 50px;}
.contactbox{text-align: left; width:80%; overflow:auto; margin: 0 auto; margin-bottom: 200px;}
/*ÄÁÅÃÆ®ÆäÀÌÁö*/








footer{width:100%; height:170px; background-color: #003766; padding-top:40px; overflow: hidden;}
.footertxt{width: 70%; margin: 0 auto; font-size: 14px; color: #fff; line-height: 1.7em;}
/*ǪÅÍ*/



















@media (min-width:2230px){
    .focus, .smallworkswrap {width:50%;}
}


@media screen and (min-width:1800px) and (max-width:2229px){
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 20px;}
}


@media screen and (min-width:1601px) and (max-width:1799px){
    #faqwrap{width: 70%;}
    .faqtxtbox{width: 85%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 20px;}
    .contactthingbox{width:70%; margin: 0 auto;}
}





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

    nav{width:40%;}
    .firstmaintxtbox {width: 75%;}
    .focus{width:70%;}
    .developwrap{width: 75%;}
    .developbox{width:13%; margin-right: 4.4%;}
    .developbox6{margin-right: 0;}
    #faqwrap{width: 75%;}
    .faqtxtbox{width: 85%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 17px; font-size:17px;}
    .answernum{font-size: 20px;}
    .answertxt{padding-top: 35px;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    .contactthingbox{width:72%; margin: 0 auto;}
}












@media screen and (min-width:1326px) and (max-width:1399px){

    nav{width:40%;}
    .firstmaintxtbox {width: 75%;}
    .focus{width:70%;}
    .smallworkswrap li{width:32%; margin:0; margin-right:2%; margin-top:2%;}
    .smallworkswrap li:nth-child(3), .smallworkswrap li:nth-child(6), .smallworkswrap li:nth-child(9), .smallworkswrap li:nth-child(12){margin-right:0;}
    .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(8) {margin-right:2%;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    .developwrap{width: 75%;}
    .developbox{width:13%; margin-right: 4.4%;}
    .developbox6{margin-right: 0;}
    #faqwrap{width: 75%;}
    .faqtxtbox{width: 85%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 17px; font-size:17px;}
    .answernum{font-size: 20px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 47%; margin: 0 1.5%; margin-bottom: 35px;}
    .answertxt5, .answertxt6{height:430px;} 
    .contactthingbox{width:75%; margin: 0 auto;}
}








@media screen and (min-width:1290px) and (max-width:1326px){

    nav{width:40%;}
    .firstmaintxtbox {width: 75%;}
    .focus{width:70%;}
    .smallworkswrap{width:70%;}
    .smallworkswrap li{width:32%; margin:0; margin-right:2%; margin-top:2%;}
    .smallworkswrap li:nth-child(3), .smallworkswrap li:nth-child(6), .smallworkswrap li:nth-child(9), .smallworkswrap li:nth-child(12){margin-right:0;}
    .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(8) {margin-right:2%;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    .developwrap{width: 75%;}
    .developbox{width:13%; margin-right: 4.4%;}
    .developbox6{margin-right: 0;}
    .developtxt{text-align: left;}
    #faqwrap{width: 80%;}
    .faqtxtbox{width: 85%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 17px; font-size:17px;}
    .answernum{font-size: 20px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 47%; margin: 0 1.5%; margin-bottom: 35px;}
    .answertxt5, .answertxt6{height:430px;} 
    .contactthingbox{width:80%; margin: 0 auto;}    
}




@media screen and (min-width:1233px) and (max-width:1289px){

    nav{width:40%;}
    .firstmaintxtbox {width: 75%;}
    .rollingtitle{width:60%; font-size: 40px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
     .rollingmaintxt2{min-width:356px;}
    .textt1{font-size: 250px; font-style: italic; font-family: 'Lobster', cursive;}
    #main_rolling{width:75%; height: auto; margin:0 auto;}
    .rolling h1{font-size: 45px;}
    .rolling_p{width:90%; margin:0 auto; font-size: 16px; margin-top:25px;} 
    .focus{width:70%;}
    .smallworkswrap{width:70%;}
    .smallworkswrap li{width:32%; margin:0; margin-right:2%; margin-top:2%;}
    .smallworkswrap li:nth-child(3), .smallworkswrap li:nth-child(6), .smallworkswrap li:nth-child(9), .smallworkswrap li:nth-child(12){margin-right:0;}
    .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(8) {margin-right:2%;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    #diffimageboxwrap{width: 1000px; margin: 0 auto; margin-top: 120px;}
    .diffimagebox{width: 290px; height: 290px; position: relative; margin-right:65px;}
    .diffimagebox3, .diffimagebox6{margin-right: 0;}
    .onestopimagewrap{width:1000px;}
    .otoimagebox{width:1000px;}
    .otoimagebox1{margin-right:132px;}
    .onetoonemarketing_smallwrap3, .onetooneRD_smallwrap3, .onetoonedevelop_smallwrap3 {margin-right:0;}
    .developwrap{width: 75%;}
    .developbox{width:13%; margin-right: 4.4%;}
    .developbox6{margin-right: 0;}
    .developtitle1{display: none;}
    .developtitle2{display: block;}
     .developtxt{text-align: left;}
    #faqwrap{width: 85%;}
    .faqtxtbox{width: 85%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 17px; font-size:17px;}
    .answernum{font-size: 20px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 47%; margin: 0 1.5%; margin-bottom: 35px;}
    .answertxt5, .answertxt6{height:430px;} 
    .contactthingbox{width:80%; margin: 0 auto;}  
}




@media screen and (min-width:1100px) and (max-width:1232px){

    nav{width:40%;}
    .firstmaintxtbox {width: 75%;}
    .rollingtitle{width:60%; font-size: 40px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
     .rollingmaintxt2{min-width:356px;}
    .textt1{font-size: 250px; font-style: italic; font-family: 'Lobster', cursive;}
    #main_rolling{width:75%; height: auto; margin:0 auto;}
    .rolling h1{font-size: 45px;}
    .rolling_p{width:90%; margin:0 auto; font-size: 16px; margin-top:25px;}
    .rolling_p_1, .rolling_p_3{display: block;}
    .rolling_p_2, .rolling_p_4{display: none;}
    .focus{width:75%; background-position: right;}
    .smallworkswrap{width:75%;}
    .smallworkswrap li{width:32%; margin:0; margin-right:2%; margin-top:2%;}
    .smallworkswrap li:nth-child(3), .smallworkswrap li:nth-child(6), .smallworkswrap li:nth-child(9), .smallworkswrap li:nth-child(12){margin-right:0;}
    .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(8) {margin-right:2%;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    #diffimageboxwrap{width: 1000px; margin: 0 auto; margin-top: 120px;}
    .diffimagebox{width: 290px; height: 290px; position: relative; margin-right:65px;}
    .diffimagebox3, .diffimagebox6{margin-right: 0;}
    .onestopimagewrap{width:1000px;}
    .otoimagebox{width:1000px;}
    .otoimagebox1{margin-right:132px;}
    .onetoonemarketing_smallwrap3, .onetooneRD_smallwrap3, .onetoonedevelop_smallwrap3 {margin-right:0;}
    .developwrap{width: 75%;}
    .developbox{width:13%; margin-right: 4.4%;}
    .developbox6{margin-right: 0;}
    .developtitle1{display: none;}
    .developtitle2{display: block;}
    .developtxt{font-size: 16px; text-align: left;}
    #faqwrap{width: 90%;}
    .faqtxtbox{width: 90%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 17px; font-size:17px;}
    .answernum{font-size: 20px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 47%; margin: 0 1.5%; margin-bottom: 35px;}
    .answertxt{width: 100%; height: 370px; min-height: 345px; padding:0 38px; padding-top: 45px;
        font-size: 14px; line-height: 1.6em;}
    .answertxt5, .answertxt6{height:440px;} 
    #gocontact{margin-top: 200px;}
    .contactthingbox{width:85%; margin: 0 auto;}
    .contactimg{width: 44%; height: 500px; float: left; 
    background: url('/base/img/rerenewal_img/contact_photo.jpg') no-repeat center center; background-size: cover; overflow: hidden;}
    .contact_context{width: 55%; height: 500px; margin-left: 1%; float: left;}
}




@media screen and (min-width:955px) and (max-width:1099px){

    nav{width:40%;}
    .firstmaintxtbox {width: 75%;}
    .firstmaintxtbox h1 {font-size: 50px; font-weight: 700; margin-bottom: 30px;}
    .firstmaintxtbox h2 {font-size: 70px; font-weight: 900; padding-top: 20px; margin-bottom: 80px;}
    .firstmaintxtbox h3 {font-size: 35px; font-weight: bolder; padding-top: 70px; }
    .rollingtitle{width:70%; font-size: 40px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
    #rollingmaintxtbox{width:80%; height: auto; margin:0 auto; text-align: right; box-sizing: border-box; margin-top:20px;}
     .rollingmaintxt2{min-width:328px;}
    .textt1{font-size: 230px; font-style: italic; font-family: 'Lobster', cursive;}
    #main_rolling{width:75%; height: auto; margin:0 auto;}
    .rolling h1{font-size: 45px;}
    .rolling_p{width:90%; margin:0 auto; font-size: 16px; margin-top:25px;}
    .rolling_p_1, .rolling_p_3{display: block;}
    .rolling_p_2, .rolling_p_4{display: none;}
    #diffimageboxwrap{width: 890px; margin: 0 auto; margin-top: 120px;}
    #diffimageboxwrap2,  #diffimageboxwrap3{width: 100%; margin: 0 auto;}
    .diffimagebox{width: 250px; height: 290px; position: relative; margin-right:70px;}
    .diffimagebox3, .diffimagebox6{margin-right: 0;}
    .diffimgsmallwrap2{position:absolute; top: 0; left: 0px;}
    .onestopimagewrap{width:890px;}
    .otoimagebox{width:890px;}
    .otoimagebox1{width:225px; margin-right:107px;}
    .onetoonemarketing_smallwrap3, .onetooneRD_smallwrap3, .onetoonedevelop_smallwrap3 {margin-right:0;}
    .servicewrap{width:940px; height:491px; margin: 0 auto; margin-top:77px; position: relative; overflow: hidden;}
    .focus{width:75%; background-position: right; padding: 30px; margin-top:90px; }
    .focustxt{margin-top: 50px; margin-bottom: 20px; font-size: 16px; font-weight: 400;}
    .focustitle{font-size: 40px; line-height: 1em;}
    .productslide{width:830px; height: 410px; margin: 0 auto; background: #003766; margin-top: 120px; position: relative;}
    .productimg{width: 350px; height: auto; border: 13px solid #fff; position: absolute; top: -50px; left: -40px;}
    .producttxtbox{position: absolute; top: 80px; left: 370px;}
    .producttitle{font-size: 35px; color: #fff; font-weight: bold;}
    .producttitle2{font-size: 20px; color: #fff; font-weight: 400; margin-top: 25px;}
    .producttxt{font-size: 15px; color: #fff; line-height: 1.6em;}
    .producttxtline{margin-top:50px; margin-bottom: 20px;}
    .toggle{position: absolute; bottom: 40px; right: 40px;}
    .smallworkswrap{width:75%;}
    .smallworkswrap li{width:32%; margin:0; margin-right:2%; margin-top:2%;}
    .smallworkswrap li:nth-child(3), .smallworkswrap li:nth-child(6), .smallworkswrap li:nth-child(9), .smallworkswrap li:nth-child(12){margin-right:0;}
    .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(8) {margin-right:2%;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    .developwrap{width: 75%;}
    .developbox{width:13%; margin-right: 4.4%;}
    .developbox6{margin-right: 0;}
    .developtitle {font-size: 19px;}
    .developtitle1{display: none;}
    .developtitle2{font-size: 19px; display: block;}
    .developtxt{font-size: 15px; line-height: 1.8em; text-align: left;}
    #faqwrap{width: 70%;}
    .faqtxtbox{width: 90%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 17px; font-size:17px;}
    .answernum{font-size: 20px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 100%; margin:0 auto; margin-bottom: 35px;}
    .answertxt{width: 100%; height: 300px; padding:0 38px; padding-top: 45px;
        font-size: 14px; line-height: 1.6em;}
    .answertxt5{height:250px;} 
    .answertxt6{height:340px;}
    #gocontact{margin-top: 200px;}
    #contactbtn{width:150px; height: auto; position: fixed; bottom:110px; left:50px; z-index: 9997; cursor: pointer;}
    .contactthingbox{width:90%; margin: 0 auto;}
    .contactimg{width: 44%; height: 500px; float: left; 
    background: url('/base/img/rerenewal_img/contact_photo.jpg') no-repeat center center; background-size: cover; overflow: hidden;}
    .contact_context{width: 55%; height: 500px; margin-left: 1%; float: left;}
    .loca_title, .time_title, .mail_title{margin-bottom: 15px; font-size: 22px;}
    .loca_txt, .time_txt, .mail_txt{margin-bottom: 10px; font-size:15px;} 
}




@media screen and (min-width:800px) and (max-width:954px){

    nav{width:60%;}
    .firstmaintxtbox {width: 75%;}
    .firstmaintxtbox h1 {font-size: 50px; font-weight: 700; margin-bottom: 30px;}
    .firstmaintxtbox h2 {font-size: 60px; font-weight: 900; padding-top: 20px; margin-bottom: 70px;}
    .firstmaintxtbox h3 {font-size: 35px; font-weight: bolder; padding-top: 50px; }
    .rollingtitle{width:70%; font-size: 35px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
    #rollingmaintxtbox{width:80%; height: auto; margin:0 auto; text-align: right; box-sizing: border-box; margin-top:20px;}
    #rollingmaintxtbox div {font-size: 20px;}
    .rollingmaintxt2{min-width:285px;}
    .textt1{font-size: 200px; font-style: italic; font-family: 'Lobster', cursive;}
    #main_rolling{width:80%; height: auto; margin:0 auto;}
    .rolling h1{font-size: 45px;}
    .rolling_p{width:90%; margin:0 auto; font-size: 16px; margin-top:25px;}
    .rolling_p_1, .rolling_p_3{display: block;}
    .rolling_p_2, .rolling_p_4{display: none;}
    #onetoonebox{padding: 95px 0 120px 0;}
    #onetoonebox p{font-size: 30px; font-weight: bold; margin-bottom: 50px;}
    #onetoonebox h1{font-size: 110px;}
    #diffimageboxwrap{width: 750px; margin: 0 auto; margin-top: 120px;}
    #diffimageboxwrap2,  #diffimageboxwrap3{width: 100%; margin: 0 auto;}
    .diffimagebox{width: 220px; height: 260px; position: relative; margin-right:45px;}
    .diffimagebox3, .diffimagebox6{margin-right: 0;}
    .diffimgsmallwrap2{position:absolute; top: 0; left: 0px;}
    .diffimgsmallwrap5{position:absolute; bottom: 0; left: 0px;}
    .arrow1, .arrow6{width:20px; height: auto;}
    .arrow2, .arrow5{width:17px; height: auto;}
    .arrow3, .arrow4{width:24.4px; height: auto;}
    .diffimgsmallwrap1 p, .diffimgsmallwrap2 p, .diffimgsmallwrap3 p{font-size: 15px; line-height: 1.3em;}
    .diffimgsmallwrap4 p, .diffimgsmallwrap5 p, .diffimgsmallwrap6 p{font-size: 15px; line-height: 1.3em;}
    .onestopimagewrap{width:750px;}
    .otoimagebox{width:750px;}
    .otoimagebox1{width:210px; margin-right:60px;}
    .onetoonemarketing_smallwrap3, .onetooneRD_smallwrap3, .onetoonedevelop_smallwrap3 {margin-right:0;}
    .servicewrap{width:760px; height:491px; margin: 0 auto; margin-top:77px; position: relative; overflow: hidden;}
    .processwrap{width: 800px;}
    .processimg{font-size: 15px;}
    .processimg img{margin-top: 10px; margin-bottom: 10px;}
    .processimgtitle{font-size: 20px; font-weight: 500;}
    .processimgtitlenum{font-size: 28px;}
    .processimg1{position: absolute; top:146px; left:479px;}
    .processimg2{position: absolute; top:412px; left:46px;}
    .processimg3{position: absolute; top:679px; left:479px;}
    .processimg4{position: absolute; top:946px; left:46px;}
    .processimg5{position: absolute; top:1212px; left:479px;}
    .processimg6{position: absolute; top:1479px; left:46px;}
    .processimg7{position: absolute; top:1746px; left:479px;}
    .processimg8{position: absolute; top:2013px; left:46px;}
    .processimg9{position: absolute; top:2280px; left:479px;}
    .focus{width:80%; background-position: -300px; padding: 30px; margin-top:90px; }
    .focustxt{margin-top: 50px; margin-bottom: 20px; font-size: 16px; font-weight: 400;}
    .focustitle{font-size: 40px; line-height: 1em;}
    .productslide{width:740px; height: 395px; margin: 0 auto; background: #003766; margin-top: 120px; position: relative;}
    .productimg{width: 310px; height: auto; border: 13px solid #fff; position: absolute; top: -50px; left: -20px;}
    .producttxtbox{position: absolute; top: 70px; left: 320px;}
    .producttitle{font-size: 33px; color: #fff; font-weight: bold;}
    .producttitle2{font-size: 20px; color: #fff; font-weight: 400; margin-top: 22px;}
    .producttxt{font-size: 15px; color: #fff; line-height: 1.6em;}
    .producttxtline{margin-top:50px; margin-bottom: 20px;}
    .toggle{position: absolute; bottom: 40px; right: 40px;}
    .smallworkswrap{width:75%;}
    .smallworkswrap li{width:32%; margin:0; margin-right:2%; margin-top:2%;}
    .smallworkswrap li:nth-child(3), .smallworkswrap li:nth-child(6), .smallworkswrap li:nth-child(9), .smallworkswrap li:nth-child(12){margin-right:0;}
    .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(8) {margin-right:2%;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    .developwrap{width: 75%; background-color: #3c5366;}
    .developbox{width:30%; margin-right: 5%;}
    .developbox3, .developbox6{margin-right: 0;}
    .developtitle {font-size: 19px; margin-bottom: 20px;}
    .developtitle1{display: block; margin-bottom: 20px;}
    .developtitle2{font-size: 19px; display: none;}
    .developtxt{font-size: 15px; line-height: 1.8em;}
    #faqwrap{width: 70%;}
    .faqtxtbox{width: 90%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 17px; font-size:17px;}
    .answernum{font-size: 20px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 100%; margin:0 auto; margin-bottom: 35px;}
    .answertxt{width: 100%; height: 330px; padding:0 38px; padding-top: 35px;
        font-size: 14px; line-height: 1.6em;}
    .answertxt5{height:250px;} 
    .answertxt6{height:340px;}
    #gocontact{margin-top: 200px;}
    #contactbtn{width:130px; height: auto; position: fixed; bottom:80px; left:30px; z-index: 9997; cursor: pointer;}
    .contactthingbox{width:65%; margin: 0 auto;}
    .contactimg{width: 100%; height: 200px; margin-bottom:20px;
    background: url('/base/img/rerenewal_img/contact_photo.jpg') no-repeat center center; background-size: cover; overflow: hidden;}
    .contact_context{width: 100%; height: 500px; margin-left: 0; float: left;}
}




@media screen and (min-width:711px) and (max-width:799px){

    .headerbox{width:80%;}
    nav{width:70%;}
    .firstmaintxtbox {width: 75%;}
    .firstmaintxtbox h1 {font-size: 45px; font-weight: 700; margin-bottom: 15px;}
    .firstmaintxtbox h2 {display: none;}
    .firstmaintxtbox p {font-size: 60px; font-weight: 900; padding-top: 15px; margin-bottom: 30px; 
        line-height: 1em; display: block;}
    .firstmaintxtbox h3 {font-size: 30px; font-weight: bolder; padding-top: 50px; }
    #rollingtitlebox{width: 85%; margin-top: 100px; height: 250px;}
    .rollingtitle{width:70%; font-size: 35px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
    #rollingmaintxtbox{width:90%; height: auto; margin:0 auto; text-align: right; box-sizing: border-box; margin-top:-20px;}
    #rollingmaintxtbox div {font-size: 20px;}
     .rollingmaintxt2{min-width:256.5px;}
    .textt1{font-size: 180px; font-style: italic; font-family: 'Lobster', cursive;}
    #main_rolling{width:80%; height: auto; margin:0 auto;}
    .rollimg{width: 80%; margin: 0 auto; margin-bottom:5px;}
    .rolling h1{font-size: 40px;}
    .rolling_p{width:90%; margin:0 auto; font-size: 15px; line-height: 1.2em; margin-top:25px;}
    .rolling_p_1, .rolling_p_3{display: block;}
    .rolling_p_2, .rolling_p_4{display: none;}
    #onetoonebox{padding: 95px 0 120px 0;}
    #onetoonebox p{font-size: 30px; font-weight: bold; margin-bottom: 50px;}
    #onetoonebox h1{font-size: 90px;}
    #diffimageboxwrap{width: 610px; margin: 0 auto; margin-top: 120px;}
    #diffimageboxwrap2,  #diffimageboxwrap3{width: 100%; margin: 0 auto;}
    .diffimagebox{width: 185px; height: 240px; position: relative; margin-right:27.5px;}
    .diffimagebox3, .diffimagebox6{margin-right: 0;}
    .diffimgsmallwrap2{position:absolute; top: 0; left: 0px;}
    .diffimgsmallwrap5{position:absolute; bottom: 0; left: 0px;}
    .arrow1, .arrow6{width:20px; height: auto;}
    .arrow2, .arrow5{width:17px; height: auto;}
    .arrow3, .arrow4{width:24.4px; height: auto;}
    .diffimgsmallwrap1 p, .diffimgsmallwrap2 p, .diffimgsmallwrap3 p{font-size: 15px; line-height: 1.3em;}
    .diffimgsmallwrap4 p, .diffimgsmallwrap5 p, .diffimgsmallwrap6 p{font-size: 15px; line-height: 1.3em;}
    .onestopimagewrap{width:610px;}
    .otoimagebox{width:610px;}
    .otoimagebox1{width:180px; margin-right:35px;}
    .otoimagebox1 p {font-size:14px;}
    .onetoonemarketing_smallwrap3, .onetooneRD_smallwrap3, .onetoonedevelop_smallwrap3 {margin-right:0;}
    .servicewrap{width:660px; height:491px; margin: 0 auto; margin-top:77px; position: relative; overflow: hidden;}
    .processwrap{background:none; width: 85%; height: auto; margin: 0 auto; margin-top: 100px; position: inherit;}
    .processimg{font-size: 14px; position: inherit; float: left; width:48.5%; margin-right: 3%; height:310px; 
        text-align: center;}
    .processimg2, .processimg4, .processimg6, .processimg8{margin-right: 0%;}
    .processimg img{margin: o auto; margin-top: 10px; margin-bottom: 10px;}
    .processimgtitle{font-size: 17px; font-weight: 500;}
    .processimgtitlenum{font-size: 18px;}
    #works{padding-top: 260px;}
    .focus{width:85%; padding: 30px; margin-top:90px;}
    .focustxt{margin-top: 20px; margin-bottom: 20px; font-size: 16px; font-weight: 400;}
    .focustitle{font-size: 40px; line-height: 1em;}
    .productslide{width:480px; height: 730px; margin: 0 auto; background: #003766; margin-top: 50px; position: relative;}
    .productimg{width: 310px; height: 310px; border: 0; position: absolute; top: 50px; left: 30px;}
    .productimg img {object-fit: cover;}
    .producttxtbox{position: absolute; top: 400px; left: 30px;}
    .producttitle{font-size: 33px; color: #fff; font-weight: bold;}
    .producttitle2{font-size: 20px; color: #fff; font-weight: 400; margin-top: 22px;}
    .producttxt{font-size: 15px; color: #fff; line-height: 1.6em;}
    .producttxtline{margin-top:40px; margin-bottom: 20px;}
    .toggle{position: absolute; bottom: 40px; right: 40px;}
    .smallworkswrap{width:85%;}
    .smallworkswrap li{width:32%; margin:0; margin-right:2%; margin-top:2%;}
    .smallworkswrap li:nth-child(3), .smallworkswrap li:nth-child(6), .smallworkswrap li:nth-child(9), .smallworkswrap li:nth-child(12){margin-right:0;}
    .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(8) {margin-right:2%;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    .developwrap{width: 75%; background-color: #3c5366;}
    .developbox{width:30%; margin-right: 5%;}
    .developbox3, .developbox6{margin-right: 0;}
    .developtitle {font-size: 19px; margin-bottom: 20px;}
    .developtitle1{display: block; margin-bottom: 20px;}
    .developtitle2{font-size: 19px; display: none;}
    .developtxt{font-size: 15px; line-height: 1.8em;}
    #faqwrap{width: 70%;}
    .faqtxtbox{width: 90%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 17px; font-size:17px;}
    .answernum{font-size: 20px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 100%; margin:0 auto; margin-bottom: 35px;}
    .answertxt{width: 100%; height: 330px; padding:0 38px; padding-top: 35px;
        font-size: 14px; line-height: 1.6em;}
    .answertxt5{height:250px;} 
    .answertxt6{height:380px;}
    #gocontact{margin-top: 200px;}
    #gocontact a{background:url('/base/img/rerenewal_img/contact_bg.jpg') no-repeat 0 0; background-size:cover; background-attachment:fixed;}
    #contactbtn{width:130px; height: auto; position: fixed; bottom:80px; left:30px; z-index: 9997; cursor: pointer;}
    .footertxt{width: 80%; }
    .contactthingbox{width:75%; margin: 0 auto;}
    .contactimg{width: 100%; height: 200px; margin-bottom:20px;
    background: url('/base/img/rerenewal_img/contact_photo.jpg') no-repeat center center; background-size: cover; overflow: hidden;}
    .contact_context{width: 100%; height: 500px; margin-left: 0; float: left;}
}








@media screen and (min-width:650px) and (max-width:710px){

    .headerbox{width:80%;}
    nav{width:70%;}
    .firstmaintxtbox {width: 75%;}
    .firstmaintxtbox h1 {font-size: 45px; font-weight: 700; margin-bottom: 15px;}
    .firstmaintxtbox h2 {display: none;}
    .firstmaintxtbox p {font-size: 60px; font-weight: 900; padding-top: 15px; margin-bottom: 30px; 
        line-height: 1em; display: block;}
    .firstmaintxtbox h3 {font-size: 30px; font-weight: bolder; padding-top: 50px; }
    #rollingtitlebox{width: 85%; margin-top: 100px; height: 250px;}
    .rollingtitle{width:70%; font-size: 35px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
    #rollingmaintxtbox{width:90%; height: auto; margin:0 auto; text-align: right; box-sizing: border-box; margin-top:-20px;}
    #rollingmaintxtbox div {font-size: 20px;}
     .rollingmaintxt2{min-width:256.5px;}
    .textt1{font-size: 180px; font-style: italic; font-family: 'Lobster', cursive;}
    #main_rolling{width:80%; height: auto; margin:0 auto;}
    .rollimg{width: 80%; margin: 0 auto; margin-bottom:5px;}
    .rolling h1{font-size: 40px;}
    .rolling_p{width:90%; margin:0 auto; font-size: 15px; line-height: 1.2em; margin-top:25px;}
    .rolling_p_1, .rolling_p_3{display: block;}
    .rolling_p_2, .rolling_p_4{display: none;}
    #onetoonebox{padding: 95px 0 120px 0;}
    #onetoonebox p{font-size: 30px; font-weight: bold; margin-bottom: 50px;}
    #onetoonebox h1{font-size: 90px;}
    #diffimageboxwrap{width: 610px; margin: 0 auto; margin-top: 120px;}
    #diffimageboxwrap2,  #diffimageboxwrap3{width: 100%; margin: 0 auto;}
    .diffimagebox{width: 185px; height: 240px; position: relative; margin-right:27.5px;}
    .diffimagebox3, .diffimagebox6{margin-right: 0;}
    .diffimgsmallwrap2{position:absolute; top: 0; left: 0px;}
    .diffimgsmallwrap5{position:absolute; bottom: 0; left: 0px;}
    .arrow1, .arrow6{width:20px; height: auto;}
    .arrow2, .arrow5{width:17px; height: auto;}
    .arrow3, .arrow4{width:24.4px; height: auto;}
    .diffimgsmallwrap1 p, .diffimgsmallwrap2 p, .diffimgsmallwrap3 p{font-size: 15px; line-height: 1.3em;}
    .diffimgsmallwrap4 p, .diffimgsmallwrap5 p, .diffimgsmallwrap6 p{font-size: 15px; line-height: 1.3em;}
    .onestopimagewrap{width:610px;}
    .otoimagebox{width:610px;}
    .otoimagebox1{width:203px; margin-right:0;}
    .otoimagebox1 p {font-size:14px;}
    .servicewrap{width:600px; height:491px; margin: 0 auto; margin-top:77px; position: relative; overflow: hidden;}
    .servicetxtbox{position: absolute; right: 33.5px; top: 71.5px;}
    .processwrap{background:none; width: 85%; height: auto; margin: 0 auto; margin-top: 100px; position: inherit;}
    .processimg{font-size: 14px; position: inherit; float: left; width:48.5%; margin-right: 3%; height:310px; 
        text-align: center;}
    .processimg2, .processimg4, .processimg6, .processimg8{margin-right: 0%;}
    .processimg img{margin: o auto; margin-top: 10px; margin-bottom: 10px;}
    .processimgtitle{font-size: 17px; font-weight: 500;}
    .processimgtitlenum{font-size: 18px;}
    #works{padding-top: 260px; }
    .focus{width:85%; padding: 30px; margin-top:90px;}
    .focustxt{margin-top: 20px; margin-bottom: 20px; font-size: 16px; font-weight: 400;}
    .focustitle{font-size: 40px; line-height: 1em;}
    .productslide{width:480px; height: 730px; margin: 0 auto; background: #003766; margin-top: 50px; position: relative;}
    .productimg{width: 310px; height: 310px; border: 0; position: absolute; top: 50px; left: 30px;}
    .productimg img {object-fit: cover;}
    .producttxtbox{position: absolute; top: 400px; left: 30px;}
    .producttitle{font-size: 33px; color: #fff; font-weight: bold;}
    .producttitle2{font-size: 20px; color: #fff; font-weight: 400; margin-top: 22px;}
    .producttxt{font-size: 15px; color: #fff; line-height: 1.6em;}
    .producttxtline{margin-top:40px; margin-bottom: 20px;}
    .toggle{position: absolute; bottom: 40px; right: 40px;}
    .smallworkswrap{width:85%;}
    .smallworkswrap li{width:48%; margin:0; margin-right:4%; margin-top:4%;}
    .smallworkswrap li:nth-child(2), .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(6),
    .smallworkswrap li:nth-child(8), .smallworkswrap li:nth-child(10), .smallworkswrap li:nth-child(12){margin-right:0;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    .developwrap{width: 75%; background-color: #3c5366;}
    .developbox{width:30%; margin-right: 5%;}
    .developbox3, .developbox6{margin-right: 0;}
    .developtitle {font-size: 19px; margin-bottom: 20px;}
    .developtitle1{display: block; margin-bottom: 20px;}
    .developtitle2{font-size: 19px; display: none;}
    .developtxt{font-size: 15px; line-height: 1.8em;}
    #faqwrap{width: 70%;}
    .faqtxtbox{width: 90%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 17px; font-size:17px;}
    .answernum{font-size: 20px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 100%; margin:0 auto; margin-bottom: 35px;}
    .answertxt{width: 100%; height: 330px; padding:0 38px; padding-top: 35px;
        font-size: 14px; line-height: 1.6em;}
    .answertxt5{height:250px;} 
    .answertxt6{height:390px;}
    #gocontact{width:100%; margin-top: 200px;}
    #gocontact a{background:url('/base/img/rerenewal_img/contact_bg.jpg') no-repeat 0 0; background-size:cover; background-attachment:fixed;}
    #contactbtn{width:130px; height: auto; position: fixed; bottom:110px; left:30px; z-index: 9997; cursor: pointer;}
    .contactthingbox{width:70%; margin: 0 auto;}
    .contactimg{width: 100%; height: 200px; margin-bottom:20px;
    background: url('/base/img/rerenewal_img/contact_photo.jpg') no-repeat center center; background-size: cover; overflow: hidden;}
    .contact_context{width: 100%; height: 500px; margin-left: 0; float: left;}
    .loca_title, .time_title, .mail_title{margin-bottom: 13px; font-size: 23px;}
    .loca_txt, .time_txt, .mail_txt{margin-bottom: 10px; font-size:15px;}
    .footertxt{width: 80%;}
}




@media screen and (min-width:538px) and (max-width:649px){

    .headerbox{width:80%;}
    nav{width:100%;}
    .firstmaintxtbox {width: 75%; bottom:15%; }
    .firstmaintxtbox h1 {font-size: 45px; font-weight: 700; margin-bottom: 15px;}
    .firstmaintxtbox h2 {display: none;}
    .firstmaintxtbox p {font-size: 60px; font-weight: 900; padding-top: 15px; margin-bottom: 30px; 
        line-height: 1em; display: block;}
    .firstmaintxtbox h3 {font-size: 30px; font-weight: bolder; padding-top: 50px; }
    #rollingtitlebox{width: 90%; margin-top: 100px; height: 250px;}
    .rollingtitle{width:75%; font-size: 30px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
    #rollingmaintxtbox{width:80%; height: auto; margin:0 auto; text-align: right; box-sizing: border-box; margin-top:-30px;}
    #rollingmaintxtbox div {font-size: 19px;}
    .rollingmaintxt2{min-width:40%;}
    .textt1{font-size: 150px; font-style: italic; font-family: 'Lobster', cursive;}
    .rollingmaintxt3{margin-top: 10px;}
    #main_rolling{width:80%; height: auto; margin:0 auto;}
    .rolling{float: left; text-align: center; width: 48%; margin-right:4%; height: 257px; margin-top: 100px;}
     .rolling2, .rolling4 {margin-right:0;}
    .rolling3, .rolling4 {margin-top: 40px;}
    .rollimg{width: 80%; margin: 0 auto; margin-bottom:5px;}
    .rolling h1{font-size: 40px;}
    .rolling_p{width:90%; margin:0 auto; font-size: 15px; line-height: 1.2em; margin-top:25px;}
    .rolling_p_1, .rolling_p_3{display: block;}
    .rolling_p_2, .rolling_p_4{display: none;}
    #onetoonebox{padding: 75px 0 90px 0;}
    #onetoonebox p{font-size: 25px; font-weight: bold; margin-bottom: 30px;}
    #onetoonebox h1{font-size: 60px;}
    .title1{font-size: 50px; line-height: 1em;}
    .titlediff{font-size: 45px; line-height: 1.2em;}
    .difftxt_m_h{display: none;}
    .difftxt_m{display: block; line-height: 1.5em;}
    .difftxt2{display: none;}
    .difftxt2_m{display: block; margin-top:65px; font-size: 16px; line-height: 1.4em; text-align: center; }
    #diffimageboxwrap{display:none;}
    .show_m{display:block;}
    #diffbox_m, #onestopbox_m{margin-top:70px;}
    #onestop{width:80%; margin: 0 auto; padding-top:40px;}
    .onestopimagewrap{display: none;}
    .onecircle_m{font-size: 17px; margin-top: 77px; display: block;}
    .onecircle_m_h{display: none;}
    #oneservice{margin-top:50px;}
    .servicewrap{width:500px; height:491px; margin: 0 auto; margin-top:77px; position: relative; overflow: hidden;}
    .servicetxtbox{position: absolute; right: 25px; top: 46px; width:450px; height:300px;}
    .servicetxt{font-size: 16px; line-height: 1.4em;}
    #oemprocess{padding-top:200px; overflow:hidden;}
    #processtitlebox{padding: 60px 0;}
    .title2{font-size: 50px; line-height: 1em; font-weight: bold;}
    .processwrap{background:none; width: 90%; height: auto; margin: 0 auto; margin-top: 100px; position: inherit;}
    .processimg{font-size: 14px; position: inherit; float: left; width:49%; margin-right: 2%; height:310px; 
        text-align: center;}
    .processimg2, .processimg4, .processimg6, .processimg8{margin-right: 0%;}
    .processimg9{height:270px;}
    .processimg img{margin: o auto; margin-top: 10px; margin-bottom: 10px;}
    .processimgtitle{font-size: 15px; font-weight: 500;}
    .processimgtitlenum{font-size: 16px;}
    #works{padding-top: 100px;}
    .focus{width:85%; padding: 25px; margin-top:70px;}
    .focustxt{display: none;}
    .focustitle{margin-top:10px; font-size: 37px; line-height: 1em;}
    .productslide{width:425px; height: 730px; margin: 0 auto; background: #003766; margin-top: 50px; position: relative;}
    .productimg{width: 280px; height: 280px; border: 0; position: absolute; top: 50px; left: 30px;}
    .productimg img {object-fit: cover;}
    .producttxtbox{position: absolute; top: 360px; left: 30px;}
    .producttitle{font-size: 32px; color: #fff; font-weight: bold;}
    .producttitle2{font-size: 18px; color: #fff; font-weight: 400; margin-top: 12px;}
    .producttxt{width: 90%; font-size: 14px; color: #fff; line-height: 1.6em;}
    .producttxtline{margin-top:30px; margin-bottom: 15px;}
    .toggle{position: absolute; bottom: 40px; right: 40px;}
    .smallworkswrap{width:85%; margin-top: 70px;}
    .smallworkswrap li{width:48%; margin:0; margin-right:4%; margin-top:4%;}
    .smallworkswrap li:nth-child(2), .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(6),
    .smallworkswrap li:nth-child(8), .smallworkswrap li:nth-child(10), .smallworkswrap li:nth-child(12){margin-right:0;}
    .works_ontxttitle{font-size:20px;}
    .works_ontxt{font-size:16px;}
    #development{padding-top:50px;}
    .developwrap{width: 80%; margin-top:50px;}
    .developbox{width:29%; margin-right: 6.5%;}
    .developbox3, .developbox6{margin-right: 0;}
    .developtitle {font-size: 19px; margin-bottom: 20px;}
    .developtitle1{display: none; margin-bottom: 20px;}
    .developtitle2{font-size: 19px; display: block;}
    .developtxt{font-size: 15px; line-height: 1.8em;}
    #faq{padding-top: 50px;}
    #faqwrap{width: 80%;}
    .faq_titlebox{margin-bottom: 80px;}
    .faqtxtbox{width: 95%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 13px; font-size:14px;}
    .answernum{font-size: 15px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 100%; margin:0 auto; margin-bottom: 25px;}
    .answertxt{width: 100%; height: 320px; padding:0 38px; padding-top: 35px;
        font-size: 14px; line-height: 1.6em;}
    .answertxt5{height:250px;} 
    .answertxt6{height:400px;}
    #gocontact{width:100%; margin-top: 200px;}
    .contacttxt{display: none;}
    .contacttxt_m{display: block; line-height: 1.4em; font-size: 16px;}
    .contactbtn2 img{width:auto; height: 32px; margin-left:2px;}
    #contactbtn{width:115px; height: auto; position: fixed; bottom:70px; left:0px; z-index: 9997; cursor: pointer;}
    .contactthingbox{width:80%; margin: 0 auto;}
    .contactimg{width: 100%; height: 200px; margin-bottom:20px;
    background: url('/base/img/rerenewal_img/contact_photo.jpg') no-repeat center center; background-size: cover; overflow: hidden;}
    .contact_context{width: 100%; height: 500px; margin-left: 0; float: left;}
    .loca_title, .time_title, .mail_title{margin-bottom: 13px; font-size: 20px;}
    .loca_txt, .time_txt, .mail_txt{margin-bottom: 10px; font-size:14px;}
    .footertxt{width: 80%;}
}


@media screen and (min-width:500px) and (max-width:537px){

    .headerbox{width:80%;}
    nav{width:100%;}
    .firstmaintxtbox {width: 75%; bottom:15%; }
    .firstmaintxtbox h1 {font-size: 45px; font-weight: 700; margin-bottom: 15px;}
    .firstmaintxtbox h2 {display: none;}
    .firstmaintxtbox p {font-size: 60px; font-weight: 900; padding-top: 15px; margin-bottom: 30px; 
        line-height: 1em; display: block;}
    .firstmaintxtbox h3 {font-size: 30px; font-weight: bolder; padding-top: 50px; }
    #rollingtitlebox{width: 90%; margin-top: 100px; height: 250px;}
    .rollingtitle{width:75%; font-size: 30px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
    #rollingmaintxtbox{width:80%; height: auto; margin:0 auto; text-align: right; box-sizing: border-box; margin-top:-30px;}
    #rollingmaintxtbox div {font-size: 19px;}
    .rollingmaintxt2{min-width:40%;}
    .textt1{font-size: 150px; font-style: italic; font-family: 'Lobster', cursive;}
    .rollingmaintxt3{margin-top: 10px;}
    #main_rolling{width:80%; height: auto; margin:0 auto;}
    .rolling{float: left; text-align: center; width: 48%; margin-right:4%; height: 257px; margin-top: 100px;}
     .rolling2, .rolling4 {margin-right:0;}
    .rolling3, .rolling4 {margin-top: 40px;}
    .rollimg{width: 80%; margin: 0 auto; margin-bottom:5px;}
    .rolling h1{font-size: 40px;}
    .rolling_p{width:90%; margin:0 auto; font-size: 15px; line-height: 1.2em; margin-top:25px;}
    .rolling_p_1, .rolling_p_3{display: block;}
    .rolling_p_2, .rolling_p_4{display: none;}
    #onetoonebox{padding: 75px 0 90px 0;}
    #onetoonebox p{font-size: 25px; font-weight: bold; margin-bottom: 30px;}
    #onetoonebox h1{font-size: 60px;}
    .title1{font-size: 50px; line-height: 1em;}
    .titlediff{font-size: 40px; line-height: 1.2em;}
    .difftxt_m_h{display: none;}
    .difftxt_m{display: block; line-height: 1.5em;}
    .difftxt2{display: none;}
    .difftxt2_m{display: block; margin-top:65px; font-size: 16px; line-height: 1.4em; text-align: center; }
    #diffimageboxwrap{display:none;}
    .show_m{display:block;}
    #diffbox_m, #onestopbox_m{margin-top:70px;}
    #onestop{width:80%; margin: 0 auto; padding-top:40px;}
    .onestopimagewrap{display: none;}
    .onecircle_m{font-size: 17px; margin-top: 77px; display: block;}
    .onecircle_m_h{display: none;}
    #oneservice{margin-top:50px;}
    .servicewrap, .serviceimage, .servicetxtbox{display: none;}
    .servicewrap_m, .servicetxtbox_m, .servicetxt_m{display: block;}
    #oemprocess{padding-top:200px; overflow:hidden;}
    #processtitlebox{padding: 60px 0;}
    .title2{font-size: 50px; line-height: 1em; font-weight: bold;}
    .processwrap{background:none; width: 90%; height: auto; margin: 0 auto; margin-top: 100px; position: inherit;}
    .processimg{font-size: 14px; position: inherit; float: left; width:49%; margin-right: 2%; height:310px; 
        text-align: center;}
    .processimg2, .processimg4, .processimg6, .processimg8{margin-right: 0%;}
    .processimg9{height:270px;}
    .processimg img{margin: o auto; margin-top: 10px; margin-bottom: 10px;}
    .processimgtitle{font-size: 15px; font-weight: 500;}
    .processimgtitlenum{font-size: 16px;}
    #works{padding-top: 200px;}
    .focus{width:85%; padding: 25px; margin-top:70px;}
    .focustxt{display: none;}
    .focustitle{margin-top:10px; font-size: 37px; line-height: 1em;}
    .productslide{width:425px; height: 730px; margin: 0 auto; background: #003766; margin-top: 50px; position: relative;}
    .productimg{width: 280px; height: 280px; border: 0; position: absolute; top: 50px; left: 30px;}
    .productimg img {object-fit: cover;}
    .producttxtbox{position: absolute; top: 360px; left: 30px;}
    .producttitle{font-size: 32px; color: #fff; font-weight: bold;}
    .producttitle2{font-size: 18px; color: #fff; font-weight: 400; margin-top: 12px;}
    .producttxt{width: 90%; font-size: 14px; color: #fff; line-height: 1.6em;}
    .producttxtline{margin-top:30px; margin-bottom: 15px;}
    .toggle{position: absolute; bottom: 40px; right: 40px;}
    .smallworkswrap{width:85%; margin-top:70px;}
    .smallworkswrap li{width:48%; margin:0; margin-right:4%; margin-top:4%;}
    .smallworkswrap li:nth-child(2), .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(6),
    .smallworkswrap li:nth-child(8), .smallworkswrap li:nth-child(10), .smallworkswrap li:nth-child(12){margin-right:0;}
    .works_ontxttitle{font-size:19px;}
    .works_ontxt{font-size:15px;}
    #development{padding-top:50px;}
    .developwrap{width: 80%; margin-top:50px;}
    .developbox{width:29%; margin-right: 6.5%;}
    .developbox3, .developbox6{margin-right: 0;}
    .developtitle {font-size: 19px; margin-bottom: 20px;}
    .developtitle1{display: none; margin-bottom: 20px;}
    .developtitle2{font-size: 19px; display: block;}
    .developtxt{font-size: 15px; line-height: 1.8em;}
    #faq{padding-top: 50px;}
    #faqwrap{width: 85%;}
    .faq_titlebox{margin-bottom: 80px;}
    .faqtxtbox{width: 95%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 13px; font-size:14px;}
    .answernum{font-size: 15px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 100%; margin:0 auto; margin-bottom: 25px;}
    .answertxt{width: 100%; height: 330px; padding:0 38px; padding-top: 35px;
        font-size: 14px; line-height: 1.6em;}
    .answertxt5{height:250px;} 
    .answertxt6{height:400px;}
    #gocontact{margin-top: 200px;}
    .contacttxt{display: none;}
    .contacttxt_m{display: block; line-height: 1.4em; font-size: 16px;}
    .contactbtn2 img{width:auto; height: 32px; margin-left:2px;}
    #contactbtn{width:115px; height: auto; position: fixed; bottom:70px; left:0px; z-index: 9997; cursor: pointer;}
    .contactthingbox{width:85%; margin: 0 auto;}
    .contactimg{width: 100%; height: 150px; margin-bottom:20px;
    background: url('/base/img/rerenewal_img/contact_photo.jpg') no-repeat center center; background-size: cover; overflow: hidden;}
    .contact_context{width: 100%; height: 500px; margin-left: 0; float: left;}
    .loca_title, .time_title, .mail_title{margin-bottom: 13px; font-size: 20px;}
    .loca_txt, .time_txt, .mail_txt{margin-bottom: 10px; font-size:14px;}
    .footertxt{width: 80%;}
}


@media screen and (min-width:0px) and (max-width:499px){

    .headerbox{width:80%;}
    nav{width:100%;}
    .firstmaintxtbox {width: 75%; bottom:10%; }
    .firstmaintxtbox h1 {font-size: 40px; font-weight: 700; margin-bottom: 15px;}
    .firstmaintxtbox h2 {display: none;}
    .firstmaintxtbox p {font-size: 55px; font-weight: 900; padding-top: 15px; margin-bottom: 20px; 
        line-height: 1em; display: block;}
    .firstmaintxtbox h3 {font-size: 30px; line-height: 1em; font-weight: bolder; padding-top: 20px; }
    #rollingtitlebox{width: 90%; margin-top: 100px; height: 200px;}
    .rollingtitle{width:80%; font-size: 30px; position: relative; top: 50%; transform: translateY(-50%); margin: 0 auto;}
    .rollingtitle_m_h{display: none;}
    .rollingtitle_m{display: block; line-height: 1em;}
    #rollingmaintxtbox{width:85%; height: auto; margin:0 auto; text-align: right; box-sizing: border-box; margin-top:-40px;}
    #rollingmaintxtbox div {font-size: 18px; margin-left:0px;}
     .rollingmaintxt2{min-width:40%;}
     .textt1{font-size: 100px; font-style: italic; font-family: 'Lobster', cursive;}
    .rollingmaintxt3{margin-top: 10px;}
    #main_rolling{width:85%; height: auto; margin:0 auto; margin-bottom: 0;}
    .rolling{float: left; text-align: center; width: 48%; margin-right:4%; height: 257px; margin-top: 70px;}
     .rolling2, .rolling4 {margin-right:0;}
    .rolling3, .rolling4 {margin-top: 10px;}
    .rollimg{width: 80%; margin: 0 auto; margin-bottom:0px;}
    .rolling img{margin-bottom:10px;}
    .rolling h1{font-size: 40px;}
    .rolling_p{width:90%; margin:0 auto; font-size: 15px; line-height: 1.2em; margin-top:25px;}
    .rolling_p_1, .rolling_p_3{display: block;}
    .rolling_p_2, .rolling_p_4{display: none;}
    #onetoone{margin-top: 150px;}
    #onetoonebox{padding: 70px 0 80px 0;}
    #onetoonebox p{font-size: 20px; font-weight: bold; margin-bottom: 20px;}
    #onetoonebox h1{font-size: 50px;}
    .title1{font-size: 45px; line-height: 1em; margin-top:100px;}
    .titlediff{display: none;}
    .titlediff_m{font-size:40px; line-height: 1.2em; display: block;}
    .difftxt_m_h{display: none;}
    .difftxt_m{display: block; line-height: 1.5em; margin:0 auto; margin-top: 60px; width: 95%; font-size: 20px;}
    .difftxt2{display: none;}
    .difftxt2_m{display: block; width: 90%; margin: 0 auto; margin-top:60px; font-size: 14px; line-height: 1.4em; 
        text-align: center;}
    #diffimageboxwrap{display:none;}
    .show_m{display:block;}
    .diffimagecenter_m{width:100%; height: auto;}
    #diffbox_m, #onestopbox_m{margin:0 auto; margin-top:60px; width:90%; height: auto;}
    #onestop{width:90%; margin: 0 auto; padding-top:40px;}
    .onecircle_m{font-size: 15px; margin-top: 65px; display: block;}
    .onecircle_m_h{display: none;}
    .onestopimagewrap{display: none;}
    #oneservice{margin-top:50px;}
    .servicewrap, .serviceimage, .servicetxtbox{display: none;}
    .servicewrap_m, .servicetxtbox_m, .servicetxt_m{display: block;}
    .servicewrap_m{padding:55px 35px 55px 35px;}
    .servicetxt_m{font-size: 14px; padding:50px 35px 50px 35px;}
    #oemprocess{padding-top:200px; overflow:hidden;}
    .oneimg1_m, .oneimg2_m, .oneimg3_m{width:100%; height: auto;}
    #processtitlebox{padding: 60px 0;}
    .title2{font-size: 50px; line-height: 1em; font-weight: bold;}
    .processwrap{background:none; width: 95%; height: auto; margin: 0 auto; margin-top: 100px; position: inherit;}
    .processimg{font-size: 14px; position: inherit; float: left; width:49.5%; margin-right: 1%; height:270px; 
        text-align: center;}
    .processimg2, .processimg4, .processimg6, .processimg8{margin-right: 0%;}
    .processimg9{height:270px;}
    .processimg img{margin: o auto; margin-top: 10px; margin-bottom: 10px;}
    .processimgtitle{font-size: 14px; font-weight: 500;}
    .processimgtitlenum{font-size: 14px;}
    .oem_m_h{display: none;}
    #works{padding-top: 200px;}
    .focus{width:85%; padding: 25px; margin-top:70px;}
    .focustxt{display: none;}
    .focustitle{margin-top:10px; font-size: 35px; line-height: 1em;}
    .productslidewrap{width: 100%; height: 100%;
        background:url('/base/img/rerenewal_img/slide_line1_1.png'), url('/base/img/rerenewal_img/slide_line2_1.png'), url('/base/img/rerenewal_img/slide_line3_1.png');
        background-repeat: repeat-x, repeat-y, repeat-x;
        background-position: top, right, bottom;}
    .productslide{width:320px; height: 670px; margin: 0 auto; background: #003766; margin-top: 50px; position: relative;}
    .productimg{width: 235px; height: 235px; border: 0; position: absolute; top: 40px; left: 25px;}
    .productimg img {object-fit: cover;}
    .producttxtbox{position: absolute; top: 310px; left: 25px;}
    .producttitle{font-size: 32px; color: #fff; font-weight: bold;}
    .producttitle2{font-size: 18px; color: #fff; font-weight: 400; margin-top: 12px;}
    .producttxt{width: 90%; font-size: 14px; color: #fff; line-height: 1.6em;}
    .producttxtline{margin-top:30px; margin-bottom: 15px;}
    .toggle{position: absolute; bottom: 40px; right: 40px;}
    .smallworkswrap{width:85%; margin-top:70px;}
    .smallworkswrap li{width:48%; margin:0; margin-right:4%; margin-top:4%;}
    .smallworkswrap li:nth-child(2), .smallworkswrap li:nth-child(4), .smallworkswrap li:nth-child(6),
    .smallworkswrap li:nth-child(8), .smallworkswrap li:nth-child(10), .smallworkswrap li:nth-child(12){margin-right:0;}
    .works_ontxttitle{font-size:19px;}
    .works_ontxt{font-size:15px;}
    #development{padding-top:50px;}
    .developwrap{width: 80%; margin-top:50px;}
    .developbox{width:45%; margin-right: 10%;}
    .developbox2, .developbox4, .developbox6{margin-right: 0;}
    .developtitle {font-size: 19px; margin-bottom: 20px;}
    .developtitle1{display: block; margin-bottom: 20px;}
    .developtitle2{font-size: 19px; display: none;}
    .developtxt{font-size: 15px; line-height: 1.8em;}
    #faq{padding-top: 50px;}
    .faqtitle{width:85%; margin: 0 auto; margin-top:100px;}
    .faq_titlebox{margin-bottom: 80px;}
    #faqwrap{width: 90%;}
    .faqtxtbox{width: 95%;}
    .answer1title, .answer2title, .answer3title, .answer4title, .answer5title, .answer6title {padding-left: 13px; font-size:14px;}
    .answernum{font-size: 15px;}
    .answertxt{padding-top: 35px;}
    .answer li {width: 100%; margin:0 auto; margin-bottom: 25px;}
    .answertxt{width: 100%; height: 380px; padding:0 38px; padding-top: 30px;
        font-size: 14px; line-height: 1.6em;}

    .answertxt1, .answertxt4{height:330px;}
    .answertxt5{height:250px;} 
    .answertxt6{height:440px;}
    .faq_m_h{display: none;}
    .faq_m{display: inline-block;}
    #gocontact{width:85%; margin-top: 150px; margin-bottom: 150px;}
    #contactbtn{width:90px; height: auto; position: fixed; bottom:30px; left:0px; z-index: 9997; cursor: pointer;}
    #contact_2{padding: 60px 0;}
    .contacttxt{display: none;}
    .contacttxt_m{display: block; line-height: 1.4em; font-size: 14px;}
    .contactbtn2 img{width:auto; height: 32px; margin-left:0px;}
    #location, #contact{margin-top:75px; padding-top:75px;}
    .contactthingbox{width:97%; margin: 0 auto;}
    .contactimg{width: 100%; height: 150px; margin-bottom:20px;
    background: url('/base/img/rerenewal_img/contact_photo.jpg') no-repeat center center; background-size: cover; overflow: hidden;}
    .contact_context{width: 100%; height: 500px; margin-left: 0; float: left;}
    .loca_title, .time_title, .mail_title{margin-bottom: 13px; font-size: 20px;}
    .loca_txt, .time_txt, .mail_txt{margin-bottom: 10px; font-size:14px;}
    .loca_a, .mail_a {width:125px;}
    .footer_m_h{display: none;}
    footer{width:100%; height:130px; background-color: #003766; padding-top:30px; overflow: hidden;}
    .footertxt{width: 80%; font-size: 14px; line-height: 1.6em;}
}