
#accordian{display: none}
#accordian li{ list-style:none; color: #fff; background: #0a2c5d; text-align: center; padding:0}
		#accordian li >h1{ cursor:pointer; font-size: 16px; position: relative; padding: 15px 0}
	#accordian 	li > ul{ display:none;}
	#accordian 	li > ul >li{ color:#00F;}
.ico_ar{position: absolute; 
    top: 25px;
    right: 25px;
    background-size: 23px; 
    width: 15px;
    height: 10px;
    }
.ico_ar img{width: 100%}
#accordian li ul{padding-top: 10px; border-top: 1px solid #074dbe}
#accordian li ul li{padding: 10px 0; font-size: 15px; color: #e1e1e1}
#accordian li ul li a{ color: #e1e1e1}

.gimobile{display: none}

@media screen and (max-width: 1480px) { 
	
	.product .box .text h2{font-size: 16px;}
    .product .box .text h1{font-size: 25px;}
    
    .end ul li:first-child{padding-left: 5%}
    .end ul li:last-child{padding-right: 5%}
    
    #logo{left: 15px}
    .rightnav{right: 15px}
    
    .nav > li > a{padding: 0 10px}
    
    
}



@media screen and (max-width: 1280px) { 
	
	.promotion ul.tabs li.current .arro{display: none}
    .mainbanner .bannertit{max-width: 900px;}
    .rightnav a{padding: 0 8px; font-size: 14px}
    .nav > li > a{font-size: 16px;}
    .nav .nav-column li a{font-size: 16px}
    
    .nav .nav-column2 h3{font-size: 22px;}
    .nav .nav-column2 p{font-size: 16px; margin-bottom: 30px;}
    .nav .nav-column2 li a{font-size: 16px; line-height: 18px;}
    
    .sub_cate b{padding: 0 20px; }
    #bo_v_info{line-height: 35px}
    
}

@media screen and (max-width: 1024px) { 
	
	#logo {
    left: 15px;
    width: 150px;
    top: 40px;}
    
    .nav > li > a {padding: 0 15px;}
    .rightnav{top: 38px;}
    
    .lazy .slick-prev, .lazy .slick-next{background-size:70px 90px; background-repeat: no-repeat; width: 70px}
    
    .mainbanner .bannertit{margin-top: 20%; max-width: 700px;}
    .brand{padding: 150px 15px;}
    .promotion .tab-content{padding: 200px 15px}
    .promotion ul.tabs li span{display: none}
    .promotion ul.tabs li{padding: 30px 15px}
    
    .promotion ul.tabs li.current {text-align: center; font-size: 20px;}
    
    
    .news{padding: 150px 15px}
    .end ul{flex-wrap: wrap;}
    .end ul li{width: 100%;}
    .end ul li:last-child{padding-left: 5%; padding-right: auto}
    .end ul li:last-child > div{width: 50%}
    
    #footer .top{padding: 50px 15px}
    #footer .footsitemap{padding: 0 15px}
    #footer .footlast{padding: 50px 15px 0 15px}
    
    .quick {
    position: fixed;
    right: 15px;
    bottom: 5%;}
    
    .companyinfo2{padding: 0 15px}
    .companyinfo2 ul {
    display: flex;
    flex-wrap: wrap;}
    .companyinfo2 ul li{width: 100%}
    .companyinfo2 ul li:last-child{padding-left: 0;}
    
    .bannerimg01{background: url(https://servore.cafe24.com/img/main/banner01t.jpg) !important;}
    .bannerimg02{background: url(https://servore.cafe24.com/img/main/banner02t.jpg) !important;}
    .bannerimg03{background: url(https://servore.cafe24.com/img/main/banner03t.jpg) !important;}
    
    .company3 ul li .textbox h3{font-size: 18px;}
    .ci{padding: 0 15px}
    .vision3 ul li h2 br{display: none; word-break: keep-all}
    .vision3 ul li p br{display: none; word-break: keep-all}
    .detail_pro{padding: 0 15px}
    .tit2 ul li p{word-break: keep-all}
    .tit2 ul li p br{display: none}
    
    #bo_gall, #bo_v, #bo_list{padding: 0 15px}
    .bo_v_com{padding: 0 15px}
    .service01 ul{width: 90%}
    .taklist{padding: 0 15px}
    .service_two{width: 98%; margin: 0 auto}
    .ci .rightinfo .graybox2 {width: 500px }
    
    .user_box h3{font-size: 16px; color: #c9c9c9}
.user_box h2{font-size: 40px; color: #0c4093; font-weight: 500; margin: 15px 0}
.user_box p{font-size: 20px; color: #555555}
    
    
}

@media screen and (max-width: 960px) {
	
	#logo{top: 15px}
	
	.brand ul li:hover > .hover{display: none}
	.brand ul li {border-right : 1px solid #eee;}
	.brand ul li img{width: 200px}
	.promotion .tab-content .tit p{word-break: keep-all}
	.promotion .tab-content .tit p br{display: none}
	
	 }


@media screen and (max-width: 860px) {
	
	.brandstory {padding-top: 0; background-image: none !important} 
	.brandstory .mission {padding: 0 0 80px; }
	.mission .since {padding: 0; font-size: 30px; margin:20px 0;  background-image: none !important}
	.mission h3 {font-size: 25px; margin-bottom: 10px; }
	.mission p {font-size: 16px; line-height: 30px; }
	.vision3 ul li h2{ font-size: 20px; line-height: 26px; }
	.vision3 ul li p{ font-size: 16px; line-height: 26px; }
	.vision3 .wbox {padding: 30px; }
	.vision3 .wbox p {font-size: 18px; line-height: 28px; }
	
	.tit2 ul.down li.flex_img3 div{width:100%}
	
}

@media screen and (max-width: 800px) { 
	
	#logo{top: 15px}
	.mainbanner{height: 60em}
	.brand ul{flex-wrap: wrap;}
	.brand ul li:hover > .hover{display: none}
	.brand ul li{width: 100%; border-right:0; border-bottom: 1px solid #eee; padding: 50px 20px;}
	
	.brand h1 {margin-bottom: 40px; }
    .brand ul li:last-child {border: 0 }
	
	
	.brand{text-align: center}
	.promotion .tab-content{padding:  150px 15px; height: auto}
	.promotion .tab-content .tit p{word-break: keep-all}
	.promotion .tab-content .tit p br{display: none}
	.promotion ul.tabs{flex-wrap: wrap; position: relative}
	.promotion ul.tabs li{width: 100%}
	.promotion {
    height: auto;
    position: relative;}
    
    .promotion ul.tabs li.current{text-align: center}
    
    
     .promotion ul.tabs li {background: #666;  border-bottom: 1px solid #888; } 
     .promotion ul.tabs li:last-child{border-bottom: 0px solid #888;}
     .promotion .tab-content {padding: 70px 3% 290px; }
     .promotion .tab-content .tit h1 {font-size: 25px; margin-bottom: 10px; }
     .promotion .tab-content .tit h2 {font-size: 40px; line-height: 35px; margin-bottom: 15px; }
     .promotion .tab-content .tit h3 {font-size: 25px; }
     .promotion .tab-content .tit p {font-size: 18px; line-height: 30px; }
    
    .tab01{background: url(https://servore.cafe24.com/img/main/tab01t.jpg) !important;}
    .tab02{background: url(https://servore.cafe24.com/img/main/tab02t.jpg) !important;}
    .tab03{background: url(https://servore.cafe24.com/img/main/tab03t.jpg) !important;}
    
    #footer .footsitemap{display: none}
    
    #footer .footinner{flex-wrap: wrap;}
    #footer .footinner .footlogo {
    width: 100%; text-align: center}
    #footer .footinner .footnav {
    color: #fff;
    width: 100%;
    text-align: center; margin-top: 30px}
    #footer .footinner .footnav ul{text-align: center}
    .container{margin: 0}
    #footer .footlast{text-align: center}
    #footer .footlast .tel {
    font-size: 20px;
    line-height: 26px;
    font-weight: 300;
    position: relative;
    right: 0;
    top: 0;
    margin-top: 15px;}
    .ci .rightinfo .textbox2 {
    display: inline-block;
    vertical-align: middle;
    padding-left: 30px;
    width: 100%;
    margin-top: 30px;}
     #footer .footlast .tel span{display: none;}
    
    .subtitle {
    padding: 110px 15px 110px;
    background-size: cover !important;
    text-align: center;}
    
    .company3 ul {
    display: flex;
    flex-wrap: wrap;}
    .company3 ul li{width: 48%}
    .company3 ul li img{width: 100%}
    .company3 ul li{margin: 1%}
    .company3 ul li:first-child{margin-left: 1%}
    
    
    .ci .rightinfo .graybox2 {width: 60%; }
    .ci .rightinfo .textbox2 {width: 30%; }
    
    .mission .since{background: none !important; padding: 0}
     .vision3 ul{
    display: flex;
    flex-wrap: wrap;}
    .vision3 ul li {
    flex: inherit;
    margin: 1%;
    width: 48%;}
    .vision3 ul li:first-child{margin-left: 1%}
    
    .vision3 .wbox p br{display: none}
    .vision3 .wbox p{word-break: keep-all}
    
    .historyinfo_right p{word-break: keep-all}
    
    .map .info ul li{padding: 40px}
    
    .location3 ul{flex-wrap: wrap;}
    .location3 ul li{width: 100%; border-right:0; padding: 50px}
    .producttop {
    display: flex;
    flex-wrap: wrap; padding: 0 15px}
    .producttop .producttop_thum {
    width: 100%;}
    .producttop .producttop_text {
    width: 100%;
    text-align: left;
    padding-left: 0; margin-top: 50px}
    .tit4 ul li p br{display: none}
    .tit4 ul li p{word-break: keep-all}
    .tit2 ul {
    border-bottom: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;}
    .tit2 ul li {
    width: 100%;
    padding: 50px 0;}
    
    .tit2 ul li:first-child {
    padding-right: 0;}
    .service01 ul li{width: 100%}
    .takinfo ul li p{line-height: 35px;}
    .service_two ul li{width: 100%; background: none !important}
    .service_two ul li:first-child{border-right:0}
    .service_two ul{min-height: auto;}
    
    .lazy .slick-prev, .lazy .slick-next{display: none !important}
    
       .ci .rightinfo{flex-wrap: wrap;}
    .ci .rightinfo .graybox2{width: 100%}
    .ci .rightinfo .textbox2{width: 100%}
    
    
    .product{padding: 150px 2% 100px}
    
    .vision { padding: 0 0 50px 0; }
    .vision3 { padding: 50px 0 100px; }
    .vision3 .wbox { margin-top : 60px }   
    
    
    .faq_product{padding: 20px}
    .faq_product .box_faq h2{font-size: 16px; line-height: 25px}
    .faq_product .box_faq h2 span{line-height: 25px; width: 25px; height: 25px}
    .faq_product .box_faq p{font-size: 16px; line-height: 25px;}
    .faq_product .box_faq p span{line-height: 25px; width: 25px; height: 25px}
    
    .review_product .box_faq{flex-direction: column;}
    .review_product .box_faq .thum_people{width: 80px}
    .review_product .box_faq .re_text h2{font-size: 18px;line-height: 30px}
    .review_product .box_faq .re_text p{font-size: 16px; line-height: 25px;}
    .review_product .box_faq .re_text p br{display: none}
    
    .user_box h3{font-size: 14px}
    .user_box h2{font-size:24px }
    .user_box p{font-size: 16px}
    
    
    
    
}



@media screen and (max-width: 760px) {

    .bannerimg01{background: url(https://servore.cafe24.com/img/main/banner01760.jpg) !important;}
    .bannerimg02{background: url(https://servore.cafe24.com/img/main/banner02760.jpg) !important;}
    .bannerimg03{background: url(https://servore.cafe24.com/img/main/banner03760.jpg) !important;}
    
    
    .mainbanner .bannertit h3 {font-size: 30px;}
.mainbanner .bannertit h1 {font-size: 50px; line-height: 60px; margin-bottom: 20px; }
.mainbanner .bannertit p {font-size: 20px; line-height: 35px; }
.mainbanner .bannerbtn {margin-top: 40px; padding: 15px 26px; }

}


@media screen and (max-width: 640px) {
	
	.ci .rightinfo .graybox2 {width: 100%; }
	.mission p {word-break: keep-all}
	.mission p br{display: none}
	
	.pro_title {padding: 20px 0;  }
	.pro_title h2 {font-size: 35px;  }
	.lefttit {padding: 20px 40px;  }
	.lefttit ul li {font-size: 18px;  }

	.none640{display: none}
	.gimobile{text-align: left; display: block}
	.gimobile img{margin-bottom: 5px}
	
	  .user_box + .user_box{margin-top: 0; padding-top: 0}
	
}

@media screen and (max-width: 600px) {
	.pagenav{display: none}
	.bannerimg01{background: url(https://servore.cafe24.com/img/main/banner01m.jpg) !important;}
    .bannerimg02{background: url(https://servore.cafe24.com/img/main/banner02m.jpg) !important;}
    .bannerimg03{background: url(https://servore.cafe24.com/img/main/banner03m.jpg) !important;}
	#accordian{display: block}
	
	
    .mainbanner .bannertit {margin-top: 15%; }
    .mainbanner .bannertit h3 {font-size: 20px; margin-top: 10px; margin-bottom: 10px; }
    .mainbanner .bannertit h1 {font-size: 45px; line-height: 55px; margin-bottom: 10px; }
    .mainbanner .bannerbtn {margin-top: 30px; padding: 10px 35px; }
	
	.mainbanner .bannerbtn span img{display: none}
	
	    #oneshot_2_7 ul{flex-wrap: wrap;}
    #oneshot_2_7 li{width: 100%; }
    
    #oneshot_2_7 li{margin: 0 0 15px 0}
    #oneshot_2_7 .subject_set .sub_content{margin-top: 0}
	
	.end ul li h2{word-break: keep-all}
	.end ul li h2 br{display: none}
	
	.companyinfo p {font-size: 20px; line-height: 30px; bottom: 30px; }
	
	.history .yearbig{display: none;}
	.history ul{flex-wrap: wrap; padding: 0 15px}
	.history ul li{width: 100%}

	.nonedis{display: none}
	
	.revers{margin-top: 50px}
	.revers li:last-child{border-left: 0}
	.leftborderm{border-left: 1px solid #004098;
    text-align: left;
    padding-left: 60px;
    padding-right: 0;}
    
    .historyinfo_left{text-align: left}
    .historyinfo_left .dot {
    position: absolute;
    left: -72px;
    top: 15px;}
    
    
    .historyinfo_left p {
    position: relative;
    margin-bottom: 10px;
    color: #333;
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    padding-right: 0px; padding-left: 30px}
    
    .historyinfo_left p b {
    position: absolute;
    left: 0;
    color: #004098;
    font-weight: 600; top: 0}
    
    .history {
    padding: 80px 15px 0;
    text-align: center;}
    
    .service01 .s_top {font-size: 18px; line-height: 20px }
    .taklist ul li {font-size: 18px; line-height: 30px;}
    .service01 .s_top span{display: none}
    
    
    .center_p{font-size: 30px; text-align: center}
.center_p p{font-size: 20px;}
.center_p .emt{height: 30px}
.center_p .left_step{text-align: left; padding: 30px; background: #f7f7f7 }

.center_p .left_step h2{color: #111; font-size: 20px; line-height: 48px; margin: 40px 0 10px 0}
.center_p .left_step p{color: #222; font-size: 16px; line-height: 35px; word-break: keep-all}
.center_p .box_gg{background: #585858; padding: 30px; position: relative; display: flex;     align-items: flex-start; gap:10px}
.center_p .box_gg img{}
.center_p .box_gg p{font-size: 16px; color: #fff; text-align: left; line-height: 22px}
    
    
}





@media screen and (max-width: 500px) {
	.companyinfo p span{display: none}
	.bannerimg01{background: url(https://servore.cafe24.com/img/main/banner01m.jpg) !important;}
    .bannerimg02{background: url(https://servore.cafe24.com/img/main/banner02m.jpg) !important;}
    .bannerimg03{background: url(https://servore.com/img/main/banner02400.jpg) !important;}
    
    .mainbanner{height: 38em}
    .mainbanner .bannertit{padding: 0 15px}
    
    .mainbanner .bannertit p {
    font-size: 16px;
    line-height: 25px;
    font-weight: 400;}
    .mainbanner .bannertit h3 {
    font-size: 18px;
    line-height: 25px;
    font-weight: 400;
    margin-top: 20px;
    margin-bottom: 15px;}
    
    .mainbanner .bannertit h1 {
    font-size: 30px;
    line-height: 40px;
    font-weight: bold;
    margin-bottom: 20px;}
    
    
    .mainbanner .bannerbtn {
    border: 1px solid #fff;
    padding: 10px 20px;
    font-size: 16px;
    line-height: 30px;
    display: inline-block;
    color: #fff;
    margin-top: 30px;
    transition-duration: 0.3s;}
    
    .mainbanner .bannerbtn2 {
    border: 1px solid #fff;
    padding: 10px 20px;
    font-size: 16px;
    line-height: 30px;
    display: inline-block;
    color: #fff;
    margin-top: 30px;
    transition-duration: 0.3s;}
    
    .mainbanner .bannerbtn3 {
    border: 1px solid #fff;
    padding: 10px 20px;
    font-size: 16px;
    line-height: 30px;
    display: inline-block;
    color: #fff;
    margin-top: 30px;
    transition-duration: 0.3s;}
    
    .end ul li:last-child {
    display: flex;
    padding-right: 18%;
    flex-wrap: wrap;}
    .end ul li:last-child > div {
    width: 100%;}
    
    .end ul li:last-child > div:last-child {
    margin-left: 0;}
    
    
    .end ul li p {margin-top: 20px }
    .end ul li {padding: 40px }
    
    
    .brand {
    padding: 50px 15px;}
    
    .promotion ul.tabs li{font-size: 17px; padding: 15px}
	.promotion .tab-content {
    padding: 50px 15px;
    height: auto;}
    
    .promotion .tab-content .tit h1{font-size: 35px; line-height: 45px; word-break: keep-all}
    .promotion .tab-content .tit h1 br{display: none}
    
    
    .product{padding: 50px 0}
    .news{padding: 50px 15px; text-align: center}
    .mainsubtitle{margin-bottom: 30px; font-size: 35px; line-height: 45px;}
    

    
    .end ul li{padding: 30px}
    .end ul li h2{font-size: 25px; line-height: 35px;}
    .end ul li p{font-size: 17px; line-height: 25px}
    .end ul li a{font-size: 17px; line-height: 25px}
    .end ul li:last-child > div:last-child{margin-top: 20px}
    #footer .footinner .footnav{display: none;}
    .quick{max-width: 70px;}
    .quick .q1 ul li p{font-size: 10px}
    
    #footer .footlast p{font-size: 15px; line-height: 18px}
    #footer .footlast .tel{font-size: 18px;}
    
    
    .subtitle h2{font-size: 35px; line-height: 45px}
    .subtitle ul{}
    .subtitle ul li{font-size: 16px; line-height: 22px; }
    .sub01{padding: 50px 0}
    .subhead h1 {
    margin-top: 20px;
    font-size: 35px;
    font-weight: 600;
    line-height: 40px;}
    .producttop .producttop_text h2 {
    font-size: 35px;
    line-height: 50px;
    color: #004098;
    font-weight: 500;
    margin: 0;}
    
    .producttop .producttop_text h3 {
    font-size: 22px;
    line-height: 30px;
    color: #222222;
    font-weight: 400;
    margin: 0;}
    
    
    
    .producttop .producttop_text table tr th, .producttop .producttop_text table tr td{padding: 10px 5px; font-size: 16px}
    
    .producttop_btn ul li {
    width: 100%;
    margin: 2px 0;
    font-weight: 400;
    text-align: center;}
    
    .producttop_btn ul li a {
    display: block;
    width: 100%;
    color: #fff;
    font-size: 16px;
    line-height: 30px;
    padding: 10px;}
    
    .tak .taktitle h2{font-size: 30px; line-height: 40px}
    
    .pro_title h2{font-size: 30px; line-height: 40px}
    .tit2 ul li h2 {
    color: #014099;
    font-size: 25px;
    line-height: 35px;
    margin: 10px 0 10px 0;}
    .tit2 ul li p {
    color: #222;
    font-size: 16px;
    line-height: 25px;}
    .tit2 ul li:last-child{padding-left: 0; padding-top: 0}
    
    .tit4 ul li{width: 100%}
    
    .productinfo table tr th, .productinfo table tr td{padding: 10px 5px; font-size: 16px}
    .lefttit {
    padding: 50px 15px;
    background: #f9f9f9;
    display: flex;
    flex-wrap: wrap;}
    .lefttit ul{width: 100%}
    .lefttit ul li{margin: 0; padding: 10px 0}
 
    .goods ul li{width: 100%; margin: 0 0 30px 0}
    .goods ul li h2{font-size: 16px; line-height: 25px}
    
    .goods ul li h2 b {
    width: 3px;
    background: #004098;
    height: 10px;
    margin-right: 10px;
    display: inline-block;}
    
    .goods ul li p {
    color: #666;
    font-size: 16px;
    line-height: 25px;
    margin-top: 30px;}
    
    .takinfo ul li{width: 100%; padding: 15px}
    .takinfo ul li h3{margin-bottom: 15px}
    .takinfo ul li h2{font-size: 25px; line-height: 30px}
    .takinfo ul li p{font-size: 16px; line-height: 25px}
    
    .takinfo .bank{padding: 15px;}
    .takinfo .bank span{display: block; margin-right: 0}
    .service01 ul li .tit1{width: 30%;}
    .service01 ul li .tit2{width: 65%; padding-left: 10px}
    .service01 ul li .tit2 h2{font-size: 18px;}
    .service01 ul li .tit2 p{font-size: 16px;}
    
    
    .service01 .s_top{word-break: keep-all}
    #bo_cate ul{flex-wrap: wrap}
    #bo_cate li {
    flex: inherit;
    width: 33.33%;}
    #bo_cate a{padding: 10px; font-size: 16px; line-height: 25px}
    
    #bo_v_info{text-align: center; word-break: keep-all}
    
}



@media screen and (max-width: 480px) {
	
    .promotion .tab-content {padding: 30px 3% 100px; }
    .promotion .tab-content .tit h2 {font-size: 15px; }
    .promotion .tab-content .tit h1 {font-size: 20px; }
    .promotion .tab-content .tit h3 {font-size: 18px; }
    .promotion .tab-content .tit p {font-size: 16px; line-height: 26px; }
    .promotion .tab-content .tit h1 {span display: none; }
    
    .company3 ul li {width: 100% }
    
    .vision {padding: 0 0 50px 0; }
    .vision3 ul li {width:100%; margin: 0 1% 60px; padding:10px;text-align: center; } 
	.vision3 .wbox{margin-top: 50px}
	.vision3{padding-bottom: 50px}
	.historytitle p{font-size: 20px}
	.historytitle h2 {
    color: #004098;
    font-size: 30px;
    font-weight: 600;
    line-height: 38px;}
	
}



@media screen and (max-width: 460px) {
	
	.map .info ul{flex-wrap: wrap;}
	.map .info ul li{padding: 25px}
	.map .info ul li:first-child{width: 100%}
	.map .info ul li:first-child img{display: none}
	
}

@media screen and (max-width: 400px) {
	
	.promotion .tab-content .tit h3 {
    font-size: 20px;
    line-height: 35px;
    font-weight: 300;
    margin-bottom: 10px;
}
	
.promotion .tab-content .tit p {
    font-size: 16px;
    line-height: 28px;
    font-weight: 300;
}	
	
	
	
	    .bannerimg01{background: url(https://servore.cafe24.com/img/main/banner01400.jpg) !important;}
    .bannerimg02{background: url(https://servore.com/img/main/banner03400.jpg) !important;}
    .bannerimg03{background: url(https://servore.com/img/main/banner02400.jpg) !important;}
	
	
.mainbanner .bannertit {padding: 0 7%; }
.mainbanner .bannertit h1 {margin-bottom: 10px; }
	
	.tab01{background: url(https://servore.cafe24.com/img/main/tab01t.jpg) !important;}
    .tab02{background: url(https://servore.cafe24.com/img/main/tab02400.jpg) !important;}
    .tab03{background: url(https://servore.cafe24.com/img/main/tab03400.jpg) !important;}
	
	.end ul li:last-child {padding-right: 5%;}
	
	
}


@media screen and (max-width: 360px) {
	
	#footer .footlast .tel {display: none}
	
	.companyinfo2 {display: none}
	
}