.mobile{
	display: none !important;
}
.hidden{
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.m10{
    margin:10px !important;
}
.m20{
    margin:20px !important;
}
.mt20{
    margin-top:20px;
}
.mb30{
	margin-bottom:30px !important;
}
.mb50{
	margin-bottom:50px !important;
}
.mb100{
	margin-bottom:100px !important;
}
.mt100{
	margin-top:100px !important;
}
.mt200{
	margin-top:200px !important;
}
.ml100{
    margin-left:100px;
}
.mr100{
    margin-right: 100px;
}
.pb0{
    padding-bottom:0 !important;
}
.pb50{
    padding-bottom:50px !important;
}
.pb100{
    padding-bottom:100px !important;
}
.pt10{
	padding-top:1px !important;
}
.pt100{
	padding-top:100px !important;
}
.sectionFirst{
    margin-top:var(--header-height);
}
.sectionSecond{
    margin-top:calc(var(--header-height) + 50px);
}
div#headerWrapper{
    width:100%;
    min-width: var(--min-width);
    background:var(--main-color);
    background:var(--white-color);
    height: 100px;
	position: fixed;
	top:0;
	z-index: 1000;
	box-shadow: 0 3px 9px rgba(0,0,0,0.35);
}
div#header{
    width:100%;
    min-width: var(--min-width);
    max-width: var(--max-width);
    height: 100px;
    margin:auto;
    position: relative;
    box-sizing: border-box;
    padding:0 20px;
    /*display: flex;
    justify-content: space-between;
    align-items: center;*/
}
div#header h1{
    margin-top:10px;
    margin-left:100px;
    float: left;
	background:url("../images/logo.svg") left center no-repeat;
	background-size:62px;
	padding-left:84px;
	line-height: 74px;
	font-size:32px;
    width:300px;
}
div#header h1 a{
    width:100%;
    height: 100%;
    display: block;
    color: var(--main-color);
}
div.navWrapper{
    width:100%;
    min-width:var(--min-width);
    /*background: linear-gradient(left,-60deg,#f99d1c,#f99c1c 10%,#f4781f 30%,#f16221 43%,#f05a22 58%,#ee1d62 76%,#ed0080 97%);*/
    background: linear-gradient(to right,#f4781f,#f16221,#f05a22,#ee1d62,#ed0080);
    background:var(--main-color);
    box-shadow: 0 0 12px rgba(0,0,0,0.55) inset;
    position: relative;
}
ul.nav{
    width:480px;
    margin:auto;
    height: 100px;
    display: flex;
    justify-content: space-between;
    align-items: center;
	margin-right: 100px;
}
ul.nav > li{
    position: relative;
    /*width:calc((100% / 7) - 5px);*/
    text-align: center;
    line-height: 100px;
    cursor: pointer;
}
ul.nav > li::after{
    content: "";
    width:0;
    height: 2px;
    background:var(--main-color);
    position: absolute;
    right:0;
    left:0;
    bottom:0;
    margin:auto;
    transition: all 0.2s;
}
ul.nav > li:hover::after,
ul.nav > li.active::after{
    width:100%;
    height: 5px;
    background:var(--main-color);
    position: absolute;
    right:0;
    left:0;
    bottom:0;
    margin:auto;
    transition: all 0.2s;
}
ul.nav > li a{
    display: block;
    width:100%;
    height: 100%;
    color:var(--main-color);
}
ul.nav > li a:hover{
    border-bottom: none !important;
    color:var(--main-color);
}
ul.nav li.active a{
    border-bottom: none !important;
    color:#fff;
}
ul.nav > li.active::after,
ul.nav > li:hover::after{
    width:100%;
    transition: all 0.2s;
}
ul.nav > li.active a{
    color:var(--main-color);
}
ul.nav > li span{
    font-size:10px;
    display: inline-block;
    color:var(--main-color);
    padding:5px 6px 3px;
    text-align: center;
    position: absolute;
    right:-20px;
    top:-16px;
    /*background:#fff;*/
    line-height: 1em;
    font-weight: bold;
    font-style: italic;
}
ul.nav > li div{
    width:100% !important;
    height: 70px;
    padding:20px 0 0;
    position: fixed;
    left:0;
	right:0;
	top:80px;
	margin:auto;
    z-index: 999;
    display: none;
}
ul.nav > li div::before{
}
ul.nav > li:hover div{
    display: block;
}
ul.nav ul.child{
    width:100%;
    height: 80px;
    display: flex;
    justify-content: space-around;
    background:#efefef;
    box-shadow: 3px 3px 9px rgba(0,0,0,0.35) inset;
    align-items: center;
}
ul.nav ul.child li{
    line-height: 24px;
    position: relative;
    padding-left:10px;
    font-weight: bold;
    text-align: left;
}
ul.nav ul.child li::before{
    content:"";
    width:16px;
    height: 16px;
    border-radius: 10px;
    position: absolute;
    margin:auto;
    background:var(--main-color);
    left:-15px;
    top:0;
    bottom:0;
    
}
ul.nav ul.child li a:hover{
    color:var(--gra6-color);
}
ul.nav ul.child li:hover::before{
    content:"";
    width:16px;
    height: 16px;
    border-radius: 10px;
    position: absolute;
    margin:auto;
    background:var(--main-color);
    left:-15px;
    top:0;
    bottom:0;
    
}
ul.nav ul.child a{
    color:var(--main-color);
}
div.subHeaderWrapper{
    width:100%;
    min-width:var(--min-width);
    max-width: var(--max-width);
    height: 50px;
    margin:auto;
    background:var(--main-color)
}
div.subHeaderWrapper.fix{
    position: fixed;
    top:0;
    z-index: 9;
}
div.subHeader{
    width:var(--min-width);
    height: 50px;
    margin:auto;
    display: flex;
    align-items: center;
    position: relative;
}
div.ticker{
    width:100%;
    display: flex;
    justify-content:space-between;
    align-items: center;
    font-size:16px;
}
div.ticker p{
    white-space: nowrap;
    overflow: hidden;
}
div.headerLink {
    width:30%;
    display: flex;
    justify-content: space-between;
    margin: auto;
    position: absolute;
    right:0;
    bottom:0;
    top:0;
    align-items: center;
}
a.top{
    width:150px;
    height: 2em;
    line-height: 2em;
    display: inline-block;
    margin:0 10px;
    text-align: center;
    font-size:16px;
    border-radius: 4px;
    color:var(--main-color);
}
a.top.inquiry{
    background:var(--main-color);
    color:#fff;
}
a.top.demo{
    background:var(--gra7-color);
    background:#fff;
}
a.top.inquiry:hover{
    background:var(--red-color);
    color:#fff;
}
a.top.demo:hover{
    background:var(--orange-color);
    color:#fff;
}

div.wrapper{
    width:100%;
}
div.wrapper.second{
	margin-top:100px;
}
div.wrapper.dark{
    background-color:var(--main-color);
    color:#fff;
}
div.top{
    width:100%;
    min-width:var(--min-width);
    margin-top:calc(100px);

    margin-bottom: 20px;
}
div#topWrapper {
    width:100%;
	min-width: var(--min-width);
    margin:auto;
	height: calc(50vh);
    min-height: 450px;
    margin-top:100px;
    margin-bottom: 30px;
	position: relative;
	overflow: hidden;
}
div#topWrapper p{
	text-align: center;
	position: absolute;
	top:0;
	bottom:0;
	right:0;
	left:0;
	margin:auto;
	width:100%;
	height: 3em;
	color:#fff;
	font-size:36px;
}
 #slide_wrapp {
	position: relative;
	width:100vw;
	height: 100%;
	overflow: hidden;
}
#slide_wrapp .slide_item {
	opacity: 0;
	transform: scale(1);
	transition: opacity 2s linear, transform 7.5s linear;
	position: relative;
}
#slide_wrapp .slide_item:not(:first-child) {
	position: absolute;
	top: 0;
	left: 0;
	right:0;
	bottom:0;
	margin: auto;
}
#slide_wrapp .slide_item.show_ {
	opacity: 1;
}
#slide_wrapp .slide_item.zoom_ {
	transform: scale(1.2);
}
#slide_wrapp .slide_item img {
	display: block;
	object-fit: cover;
	width:100%;
	height: 100%;

}

div.slides.case1 h2{
    width:300px;
    height: 90px;
    position: absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
}
div.slides.case1 h2 img{
    width:300px;
    height: 90px;
}
/*slick*/
button.slick-prev {
	background: url("../images/arrow_prev.svg") no-repeat;
	background-size: 30px;
	left: 10px;
}
div.presenWrapper button.slick-prev{
	left: 35px;
}
button.slick-prev:hover {
	background-image: url(../images/arrow_prev_on.svg) !important;
}
button.slick-next {
	background: url("../images/arrow_next.svg") no-repeat;
	background-size: 30px;
	right: 10px;
}
div.presenWrapper button.slick-next{
	right: 35px;
}
button.slick-next:hover {
	background-image: url(../images/arrow_next_on.svg) !important;
}
button.slick-arrow {
	text-indent: -9999px;
	position: absolute;
	width: 30px;
	height: 30px;
	z-index: 1;
	border: none;
	cursor: pointer;
}
button.slick-arrow{
    top:calc(210px + 15px);
}
ul.slick-dots {
	width: 100%;
	height: 20px;
	text-align: center;
	overflow: hidden;
	position: absolute;
	bottom: -15px;
}
ul.slick-dots li {
	text-indent: -9999px;
	display: inline-block;
	width: 10px;
	height: 10px;
	background-color: var(--gra7-color);
	border-radius: 10px;
	margin: 5px;
}
li.slick-active {
	background-color: var(--gra1-color) !important;
}
/*end of slick*/
section.bg{
    width: 100%;
    min-width: var(--min-width);
    overflow: hidden;
    position: relative;
}
section.bg::before{
    content: "";
    width:calc(100vw - 5vw);
    height: calc(100% - 150px);
    background:var(--lightgreen-color);
    position: absolute;
    top:150px;
}
div.wrapper{
    width: 100%;
    min-width: var(--min-width);
    overflow: hidden;
    position: relative;
    padding-top:50px;
    padding-bottom:50px;
	background:var(--white-color);
}
div.automl{
    padding-bottom:100px;
    position: relative;
}
div.info ul{
    margin-left:60px;
}
div.tomoreWrapper{
    width:960px;
    margin:auto;
    display: flex;
    justify-content: space-around;
}
a.tomore{
    display: block;
    width:220px;
    height: 40px;
    line-height: 40px;
    background-color:var(--gra6-color);
    text-align: center;
    border-radius: 20px;
    margin:50px auto;
    color:#fff;
}
a.tomore:hover{
    background-color:#fff;
    color:var(--main-color);
}
div#footerWrapper {
    width:100%;
    min-width:var(--min-width);
    margin-top:0;
    background-color:var(--main-color);
    background-color:#333;
    box-shadow: 0 3px 12px rgba(0,0,0,0.6) inset;
    padding:50px 0
}
div#footer{
    width:var(--min-width);
    text-align: center;
    margin:auto;
    color:#fff;
}
div#footer h1{
    font-size: 24px;
    margin-bottom: 20px;
    display: block;
	background:url("../images/footer_logo.svg") center top no-repeat;
	background-size:130px;
	padding-top:200px;
	
}
div#footer img {
    margin-bottom: 20px;
    width: 300px;
    height: auto;
}
div#footer ul{
    margin:50px auto;
    border-top:1px solid #fff;
    border-bottom:1px solid #fff;
    display: flex;
    justify-content: space-between;
    padding:30px 100px;
}
div#footer ul a{
    color:#fff;
}
div#footer p.copy{
    font-size:12px;
}
p#totop{
    width:50px;
    height: 50px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-image:url("../images/totop.svg");
    background-size:50px;
    background-position: center top;
    position: fixed;
    right:20px;
    bottom:20px;
}
p#totop a{
    display: block;
    width:100%;
    height: 100%;
}
p#totop:hover{
    background-position: center bottom;
}
div.h2Wrapper{
    width:100%;
    min-width:var(--min-width);
    height: 80px;
    margin-top:80px;
    margin-bottom:10px;
    /*background-image: linear-gradient(90deg, rgb(72, 72, 72),rgb(243, 243, 243)),linear-gradient(0deg, rgb(89, 116, 30) 0%, rgb(89, 116, 30) 16%,rgb(112, 136, 32) 16%, rgb(112, 136, 32) 63%,rgb(135, 156, 34) 63%, rgb(135, 156, 34) 66%,rgb(158, 175, 36) 66%, rgb(158, 175, 36) 71%,rgb(181, 195, 38) 71%, rgb(181, 195, 38) 90%,rgb(204, 215, 40) 90%, rgb(204, 215, 40) 100%),linear-gradient(67.5deg, rgb(89, 116, 30) 0%, rgb(89, 116, 30) 16%,rgb(112, 136, 32) 16%, rgb(112, 136, 32) 63%,rgb(135, 156, 34) 63%, rgb(135, 156, 34) 66%,rgb(158, 175, 36) 66%, rgb(158, 175, 36) 71%,rgb(181, 195, 38) 71%, rgb(181, 195, 38) 90%,rgb(204, 215, 40) 90%, rgb(204, 215, 40) 100%),linear-gradient(157.5deg, rgb(89, 116, 30) 0%, rgb(89, 116, 30) 16%,rgb(112, 136, 32) 16%, rgb(112, 136, 32) 63%,rgb(135, 156, 34) 63%, rgb(135, 156, 34) 66%,rgb(158, 175, 36) 66%, rgb(158, 175, 36) 71%,rgb(181, 195, 38) 71%, rgb(181, 195, 38) 90%,rgb(204, 215, 40) 90%, rgb(204, 215, 40) 100%); background-blend-mode:overlay, overlay, overlay, normal;*/
    border-bottom: 1px solid #fff;
    padding-bottom: 10px;

}
div.h2Wrapper.white{
    background:#fff;
    border-bottom: none;
    padding-bottom: 0;
}
div.h2Wrapper.color{
    background: hsla(267, 32%, 53%, 1);
    background: linear-gradient(0deg, hsla(267, 32%, 53%, 1) 0%, hsla(240, 100%, 6%, 1) 70%, hsla(240, 100%, 6%, 1) 100%);
    background: -moz-linear-gradient(0deg, hsla(267, 32%, 53%, 1) 0%, hsla(240, 100%, 6%, 1) 70%, hsla(240, 100%, 6%, 1) 100%);
    background: -webkit-linear-gradient(0deg, hsla(267, 32%, 53%, 1) 0%, hsla(240, 100%, 6%, 1) 70%, hsla(240, 100%, 6%, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr="#825FAD", endColorstr="#000021", GradientType=1 );
    border-bottom: none;
    padding-bottom: 0;
}
div.h2Wrapper h2,
div.h2Wrapper.color h2{
    width:var(--min-width);
    margin:auto;
    line-height: 80px;
    color:#fff;
    position: relative;
}
div.h2Wrapper.white h2{
    color:var(--main-color);
}
div.h2Wrapper h2 > span,
div.h2Wrapper.color h2 > span{
    font-size:36px;
    border-left:4px solid #fff;
    padding-left:30px;
}
div.h2Wrapper.white h2 > span{
    font-size:36px;
    border-left:4px solid var(--main-color);
    padding-left:30px;
}

p.pankuzu {
    width:var(--min-width);
    margin:30px auto 30px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color:#fff;
}
p.pankuzu a{
    color:#fff;
}
p.pankuzu a:hover{
    color:var(--orange-color);
}
p.pankuzu span.arrow{
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 6px 12px;
    border-color: transparent transparent transparent #fff;
    margin:0 20px
}
p.pankuzu span.current{
    border-bottom:2px solid #fff;
}

h4.line {
    width:calc(100% - 200px);
    margin:30px auto 10px;
    font-size:20px;
    color:var(--main-color);
    text-align: center;
    position: relative;
    height: 30px;
    font-weight: bold;
}
h4.line::before{
    content:"";
    width:100%;
    height: 2px;
    background-color:var(--main-color);
    position: absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
    z-index: -0
}
h4.line span{
    padding:0 30px;
    width:300px;
    background:#fff;
    display: inline-block;
    position: absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
}




div.main{
    width:calc(100% - 240px);
    float: right;
}
div.page {
	width: calc(100% - 10px);
	padding: 5px;
	text-align: center;
	margin: 50px auto 0;
	display: flex;
	overflow: hidden;
	-webkit-justify-content: center; /* Safari */
	justify-content: center;
    font-family: proxima-nova,proxima nova,open sans,Arial,Helvetica,sans-serif;
}
div.page span.current_page {
	background: var(--main-color);
	padding: 1px;
	min-width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
    color:#fff;
}
div.page a,
a.link_next,
a.link_before{
	display: block;
	background: #CCC;
	padding: 1px;
	min-width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
}
a.link_next {
    padding-left:10px !important;
    padding-right: 10px !important;
    margin-left:4px;
}
a.link_before {
    padding-left:10px !important;
    padding-right: 10px !important;
    margin-right:4px;
}
div.page span:last-child{
}
div.page a:hover {
	background: var(--main-color);
	color: #fff;
}
h3.stripe{
    width:100%;
    height: 60px;
    background-image: linear-gradient(90deg, rgb(167, 167, 167),rgb(27, 27, 27)),linear-gradient(45deg, rgb(116, 19, 48) 0%, rgb(116, 19, 48) 69%,rgb(141, 30, 47) 69%, rgb(141, 30, 47) 75%,rgb(166, 41, 47) 75%, rgb(166, 41, 47) 81%,rgb(192, 52, 46) 81%, rgb(192, 52, 46) 85%,rgb(217, 63, 46) 85%, rgb(217, 63, 46) 91%,rgb(242, 74, 45) 91%, rgb(242, 74, 45) 100%),linear-gradient(135deg, rgb(116, 19, 48) 0%, rgb(116, 19, 48) 69%,rgb(141, 30, 47) 69%, rgb(141, 30, 47) 75%,rgb(166, 41, 47) 75%, rgb(166, 41, 47) 81%,rgb(192, 52, 46) 81%, rgb(192, 52, 46) 85%,rgb(217, 63, 46) 85%, rgb(217, 63, 46) 91%,rgb(242, 74, 45) 91%, rgb(242, 74, 45) 100%); background-blend-mode:overlay,overlay,normal;
    line-height: 60px;
    font-size:22px;
    text-indent: 30px;
    color:#fff;
    margin:0 0 50px;
}

div.entryBody img{
    max-width:100%;
    height: auto;
    margin:15px auto;
}
div.entryBody h1{
    font-size:28px;
    margin:20px 0;
    font-weight: bold;
}
div.entryBody h2{
    font-size:24px;
    margin:16px 0;
    font-weight: bold;
}
div.entryBody h3{
    font-size:20px;
    margin:12px 0;
    font-weight: bold;
    border-bottom:1px solid #fff;
}
div.entryBody h4{
    font-size:18px;
    margin:12px 0;
    font-weight: bold;
}
div.entryBody ul,
div.entryBody ol{
    margin:10px 10px 10px 40px;
    font-size:16px;
}
div.entryBody ul li{
    list-style: disc;
}
div.entryBody p{
    font-size:18px;
    margin-bottom:1em;
    margin-left:10px;
    text-align: justify;
}
div.entryBody table{
    width:100%;
    border-top:1px solid #ccc;
    border-right:1px solid #ccc;
}
div.entryBody table td{
    padding:10px;
    border-bottom:1px solid #ccc;
    border-left:1px solid #ccc;
}
div.entryBody blockquote{
    padding:20px;
    background:var(--purple-color);
}
table.noborder{
    border: none !important;
}
table.noborder td{
    border: none !important;
    width:50%;
    text-align: center;
    font-size: 14px;
}
div.prevnext{
	clear: both;
	margin:30px auto;
	padding-top:15px;
	border-top:1px solid #fff;
	overflow: hidden;
    font-size:16px;
}
div.prevnext div{
	width:calc(45% - 15px);
	background-repeat: no-repeat;
	background-size:20px;
}
div.prevnext a{

}
div.prevnext a:hover{
    color:var(--gra1-color);
}
div.prev{
	padding-left:30px;
	background-image:url("../images/arrow_prev_on.svg");
	background-position: left top 0.1em;
	float: left;
}
div.next{
	padding-right:30px;
	background-image:url("../images/arrow_next_on.svg");
	background-position: right top 0.1em;
	text-align: right;
	float: right;
}
div.newsListWrapper {
    
}
div.newsList{
    margin-bottom:20px;
    margin-left:50px;
    border-left:4px solid var(--lightgreen-color);
    padding-left:20px;
}
div.newsList p.date{
    font-size:14px;
    background:var(--lightgreen-color);
    width:100px;
    text-align: center;
    margin-bottom:10px;
}


h2.top {
    margin:0px auto 20px;
    text-align:center;
    font-size:32px;
    line-height: 80px;
    height:80px;
    font-weight: bold;
    background-color:#fff;
    color:var(--white-color);
    box-shadow: 3px 3px 9px rgba(0,0,0,0.35) inset;
	background-image: radial-gradient(circle at 17% 77%, rgba(17, 17, 17,0.04) 0%, rgba(17, 17, 17,0.04) 50%,rgba(197, 197, 197,0.04) 50%, rgba(197, 197, 197,0.04) 100%),radial-gradient(circle at 26% 17%, rgba(64, 64, 64,0.04) 0%, rgba(64, 64, 64,0.04) 50%,rgba(244, 244, 244,0.04) 50%, rgba(244, 244, 244,0.04) 100%),radial-gradient(circle at 44% 60%, rgba(177, 177, 177,0.04) 0%, rgba(177, 177, 177,0.04) 50%,rgba(187, 187, 187,0.04) 50%, rgba(187, 187, 187,0.04) 100%),linear-gradient(19deg, rgb(28, 117, 250),rgb(34, 2, 159));
}
 
h2.top + p{
    width:960px;
    margin:auto auto 30px;
    box-sizing: border-box;
    padding:20px;
    /*border:1px solid #fff;
    border-radius: 8px;*/
    line-height: 2em;
}

div.topProductWrapper {
    display: flex;
    justify-content: space-between;
	flex-wrap: wrap;
    width:var(--min-width);
    margin:20px auto;
}
div.topProductWrapper a{
}
div.topProduct{
    width:calc(50% - 20px);
    display: block;
	margin-bottom:30px;
    background:#fff;
    box-sizing: border-box;
    padding:20px;
    padding-top:150px;
    border-radius: 8px;
    background-repeat: no-repeat;
    background-position:
        center top 25px,
        right 10px top 10px;
    position: relative;
    background-color:var(--main-color);
    background-size:
        110px,
        20px;
    transition: all 0.25s;
    box-shadow: 3px 3px 12px rgba(0,0,0,0.7) inset;
}
div.topProduct:hover{
}
div.topProduct h3{
    font-weight: bold;
    text-align: center;
    line-height: 2em;
    font-size:24px;
    border-top:2px solid #fff;
    border-bottom:2px solid #fff;
    color:#fff;
}
div.topProduct:hover h3{
}
div.topProductWrapper div.topProduct:nth-child(1){
    background-image:url("../images/sol1.svg");
}
div.topProductWrapper div.topProduct:nth-child(2){
    background-image:url("../images/sol2.svg");
}
div.topProductWrapper div.topProduct:nth-child(3){
    background-image:url("../images/sol3.svg");
}
div.topProductWrapper div.topProduct:nth-child(4){
    background-image:url("../images/sol4.svg");
}
div.topProduct ul{
    margin:10px;
    font-size:16px;
    /*font-weight: bold;*/
    color:#fff;
}
div.topProduct:hover ul{
}
div.topProduct ul li{
    margin-left:20px;
    position: relative;
    font-size:18px;
}
div.topProduct ul li::before{
    content: "";
    position: absolute;
    margin:auto;
    background:#fff;
    border-radius: 50%;
    width:12px;
    height: 12px;
    top:5px;
    left:-20px;
}
ul.news{
    width:var(--min-width);
    margin:50px auto 50px;
    border-bottom:1px solid #ccc;
}
ul.news li{
    padding:10px;
    border-top:1px solid #ccc;
    width:calc(100% - 20px);
}
ul.news div{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
ul.news a{
    display: block;
    width:calc(100% - 20px);
    color:var(--main-color);
    margin-top:15px;
    margin-left:50px;
}
ul.news a:hover{
    color:var(--hover-color);
}
ul.news span{
    display: block;
}
ul.news span.date{
    font-size:14px;
    color:var(--main-color);
    margin-bottom:5px;
    text-align: left;
    display: inline-block;
    width:100px;
    float: left;
}
ul.news span.category{
    font-size:14px;
    text-align: center;
    display: inline-block;
    width:120px;
    line-height: 1.5em;
}
ul.news span.category.news{
    background:var(--red-color);
}
ul.news span.category.event{
    background:var(--orange-color);
}
div.inner{
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    width:calc(var(--min-width));
    margin:auto;
}
div.inner2{
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width:100%;
}
div.contents {
    width:var(--min-width);
    margin:auto auto 50px;
    /*background:#fff;
    border-radius: 8px;*/
    box-sizing: border-box;
    /*padding:25px;*/
    overflow: hidden;
    box-shadow: 3px 3px 9px rgba(0,0,0,0.35) inset;
}


h3.general {
    height: 50px;
    line-height: 50px;
    border-radius: 4px;
    font-size:24px;
    background:var(--orange-color);
    text-indent: 25px;
    color:#fff;
    margin-bottom:25px;
    background-image: repeating-linear-gradient(45deg, rgba(0,0,0,0.07),rgba(0,0,0,0.05),rgba(0,0,0,0.02),rgba(0,0,0,0.08),rgba(0,0,0,0.07),rgba(0,0,0,0.03),rgba(0,0,0,0.06),rgba(0,0,0,0.08),rgba(0,0,0,0.02),rgba(0,0,0,0.08),rgba(0,0,0,0.02),rgba(0,0,0,0.07),rgba(0,0,0,0.08),rgba(0,0,0,0.09),rgba(0,0,0,0.01) 3px),linear-gradient(90deg, rgb(240,90,34),rgb(238,29,98));
}
p.general {
    width:960px;
    margin:25px auto;
    text-align: justify
}
p.general.white {
    width: auto;
    margin:25px auto;
    box-sizing: border-box;
    color:#fff;
    font-size:24px;
    border-top:2px solid #fff;
    border-bottom:2px solid #fff;
    padding:25px 35px;
}
div.page {
	width: 100%;
	padding: 5px;
	text-align: center;
	margin: 10px auto;
	display: flex;
	overflow: hidden;
	-webkit-justify-content: center; /* Safari */
	justify-content: center;
}
div.page span.current_page {
	border: 1px solid #fff;
	background: #CCC;
	padding: 2px;
	min-width: 35px;
	height: 35px;
	line-height: 35px;
	margin: 3px;
	text-align: center;
}
div.page a, a.link_next {
	display: block;
	border: 1px solid #666;
	background: #CCC;
	padding: 2px;
	min-width: 35px;
	height: 35px;
	line-height: 35px;
	margin-bottom: 5px;
	text-align: center;
	margin: 3px;
}
.link_next {
    padding:2px 10px !important;
}
div.page a:hover {
	border: 1px solid #666;
	background: var(--main-color);
	color: #fff;
}

div.entryBody {
    margin:50px
}

div.blogInfo {
    overflow: hidden;
}

div.downloadImg {
    width:640px;
    height: 480px;
    margin:50px auto;
    padding:5px;
    background:#fff;
}
div.movieWrapper{
    width:100%;
    height: 500px;
    margin-bottom:50px;
}

div.downloadImg img{
    width:640px;
    height: 480px;
    object-fit: cover;
    display: inline-block;
    border:10px solid #fff;
    box-shadow: 3px 3px 9px rgba(0,0,0,0.35);
}

a.download {
    width:360px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border-radius: 8px;
    color:#fff;
    background:var(--main-color);
    display: block;
    margin:50px auto;
}
a.download:hover{
    background:var(--orange-color);
}



h3.solution {
    text-align: center;
    font-size:24px;
    font-weight: bold;
}

p.secondTitle {
    /*color: #ACB6E5;
    background: -webkit-linear-gradient(0deg, var(--gra1-color), var(--gra7-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;*/
    color:#fff;
    font-size:36px;
    font-weight: bold;
    margin:50px;
    text-align: center;
    
}

ul.star {
    margin:25px 240px;
}
ul.star li{
    line-height: 40px;
    padding-left:30px;
    margin-bottom:10px;
    font-weight: bold;
    color:#fff;
    position: relative;
    text-align: justify;
}
ul.star li::before{
    content: "";
    width:12px;
    height: 12px;
    border-radius: 5px;
    background:#fff;
    position: absolute;
    top:0.7em;
    left:0;
}
div.bigdata{
    width:370px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    /*background:var(--gra4-color);*/
    margin:10px;
    border-radius: 8px;
}

.button a{
    display: block;
    width:20px;
    height: 20px;
    background:red;
}
a.zoom{
    position: relative;
    display: block;
}

div.down_arrow01 {
    background:url("../images/down_arrow01.svg") center top 20px no-repeat ;
    width:50px;
    height: 138px;
    background-size:50px;
    margin:0 auto 25px;
}
div.down_arrow02 {
    background:url("../images/down_arrow02.svg") center center no-repeat;
    width:62.5px;
    height: 50.5px;
    background-size:62.5px;
    margin:auto;
}

h3.title {
    font-size:24px;
    font-weight: bold;
    text-align: center;
    position: relative;
    width:780px;
    margin:25px auto;
}
h3.title::before{
    content: "";
    width:80px;
    height: 5px;
    background:var(--main-color);
    position: absolute;
    left:0;
    top:0.5em;
}
h3.title::after{
    content: "";
    width:80px;
    height: 5px;
    background:var(--main-color);
    position: absolute;
    right:0;
    top:0.5em;
}

div.margin{
    padding-top:100px;
    margin-top:-100px;
}

div.h3Wrapper {
    margin:25px 80px;
    height: 48px;
    color: var(--main-color);
}
div.h3Wrapper h3{
    width: 70%;
    height: 48px;
    line-height: 48px;
    font-size: 22px;
    text-indent: 20px;
    float: left;
    position: relative;
    background:#fff;;
}
div.h3Wrapper h3::after{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 48px 32px 0 0;
    position: absolute;
    top: 0;
    right: -32px;
    border-color: #fff transparent transparent transparent;
}
div.h3Wrapper span.title{
	display: block;
	width:calc(30% - 15px);
	height: 48px;
	line-height: 48px;
	padding-right: 15px;
	text-align: right;
	float: right;
}
div.h3Wrapper span.title.brown{
	background:var(--brown-color);
}
div.h3Wrapper span.title.violet{
	background:var(--violet-color);
}
div.h3Wrapper span.title.skyblue{
	background:var(--skygreen-color);
}
div.h3Wrapper span.title.green{
	background:var(--main-color);
}



h3.entryTitle{
    font-size:24px;
    margin:0 25px 25px;
    position: relative;
    padding-left:30px;
    border-bottom:2px solid #fff;
}
h3.entryTitle2{
    font-size:24px;
    margin:0 auto 25px;
    position: relative;
    text-align: center;
    border-bottom:2px solid #fff;
    width:860px;
    padding-bottom:10px;
}
h3.entryTitle::before{
    content: "";
    width:20px;
    height: 20px;
    background:#fff;
    position: absolute;
    border-radius: 20px;
    top:0.3em;
    left:0;
}

div.entryInfo{
    float: right;
    width:200px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
div.entryInfo p.date{
    font-size:14px;
    margin-right: 10px;
}
div.entryInfo a.category{
    background:var(--gra6-color);
    padding:0 10px;
    font-size:14px;
}


p.rightArrow{
    background:url("../images/rightArrow.svg") center center no-repeat;
    width:48px;
    height: 260px;
    background-size:48px;
}

div.lisenceWrapper {
    width:100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
div.lisence{
    background:#fff;
    color:var(--main-color);
    box-sizing: border-box;
    padding:15px;
    width:380px;
    margin-bottom:10px;
    box-shadow: 3px 3px 9px rgba(0,0,0,0.35);
}
div.lisence a:hover{
    color:var(--main-color);
}
div.lisence h4{
    font-weight: bold;
    border-bottom: 2px solid var(--gra3-color);
}
div.h4Wrapper span{
	display: block;
	width:calc(30% - 15px);
	height: 48px;
	line-height: 48px;
	padding-right: 15px;
	text-align: right;
	float: right;
    background:var(--purple-color)
}
div.h4Wrapper {
    width:100%;
    height: 48px;
    border-radius: 12px;
    background:#fff;

    overflow: hidden;
    position: absolute;
    top:-25px;
    left:-25px;
    border:4px solid #fff;
    color: var(--main-color);
}
div.h4Wrapper h4{
    width: 80%;
    height: 48px;
    line-height: 48px;
    font-size: 22px;
    text-indent: 20px;
    float: left;
    position: relative;
    background:#fff;;
}
div.h4Wrapper h4::after{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 48px 32px 0 0;
    position: absolute;
    top: 0;
    right: -32px;
    border-color: #fff transparent transparent transparent;
}
div.h4Wrapper span.title{
	display: block;
	width:calc(20% - 15px);
	height: 48px;
	line-height: 48px;
	padding-right: 15px;
	text-align: right;
	float: right;
}
div.h4Wrapper span.title.brown{
	background:var(--brown-color);
}
div.h4Wrapper span.title.violet{
	background:var(--violet-color);
}
div.h4Wrapper span.title.skyblue{
	background:var(--skygreen-color);
}
div.h4Wrapper span.title.green{
	background:var(--main-color);
}

ul.general{
    
}
ul.general li{
    margin-bottom: 10px;
    padding-left:24px;
    position: relative;
}
ul.general li::before{
    content: "";
    width:14px;
    height: 14px;
    border-radius: 14px;
    background:#fff;
    position: absolute;
    top:0.2em;
    left:0;
}



ul.contact {
    width:640px;
    margin:25px auto 50px;
    display: flex;
    justify-content: space-between;
}
ul.contact li > a{
    display: block;
    width:300px;
    height:50px;
    line-height:50px;
    text-align:center;
    background:#fff;
    color:var(--main-color);
    border-radius:8px;
}
ul.contact li > a:hover{
    background:var(--orange-color);
    color:#fff;
}
#s3{
    padding-top:130px;
    margin-top:-130px;
}
div.map {
    width:calc(var(--min-width) - 20px);
    height: 500px;
    margin-top:10px;
    margin:50px auto;
    box-sizing: border-box;
	border:10px solid var(--white-color);
    box-shadow: 3px 3px 9px rgba(0,0,0,0.35);
}

p.top {
	font-size:20px;
	text-align: justify;
	box-sizing: border-box;
	padding:20px;
	border:2px solid var(--main-color);
	border-radius: 12px;
	background-image:url("../images/logo_20.svg");
	background-position: center center;
	background-size:420px;
	background-repeat: no-repeat;
}
dl.company{
    width:760px;
    margin:25px auto;
    overflow: hidden;
    border-bottom:1px solid #ccc;
}
dl.inquiry{
	overflow: inherit;
}

dl.company dt,
dl.company dd{
    padding:10px;
}
dl.company dt{
    width:calc(30% - 20px);
    float: left;
    border-top:1px solid #ccc;
    clear: both;
	position: relative;
}
dl.company dd{
    width:calc(70% - 20px);
    float: right;
    border-top:1px solid #ccc;
	position: relative;
}
dl.company dt.must + dd::after{
	content: "必須";
	font-size: 12px;
	padding:1px 10px 0px;
	color:#fff;
	background:var(--main-color);
	margin-bottom: 5px;
	display: inline-block;
	margin-left:20px;
	border-radius: 4px;
	position: absolute;
	right:20px;
	top:17px;
}
div.submit {
	width: 100%;
	display: flex;
	justify-content: space-around;
	margin:25px auto;
}
input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
input[type="password"]{
    border:1px solid #ccc;
    width:calc(100% - 30px);
    margin-left:30px;
    line-height: 2em;
    border-radius: 4px;
    box-sizing: border-box;
    padding:5px 10px;
    margin-bottom:20px;
}
input[type="submit"],
input[type="button"]{
    width:300px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    margin:25px auto;
    border-radius: 4px;
    cursor: pointer;
    color:#fff;
}
input[type="submit"]{
    background:var(--main-color);
}
input[type="submit"]:hover{
	background:var(--blue-color);
}
input[type="button"]{
    background:#333;
}
input[type="button"]:hover{
	background:var(--blue-color);
}
.req {
	color:red;
}

input[type=checkbox]{
	width:16px;
	height: 16px;
	border:2px solid var(--main-color);
	cursor: pointer;
}
input[type=checkbox]:checked{
	background:var(--main-color);
}


div.privacyBox {
	text-align: center;
	width:100%;
}
.privacyBox label{
	margin-left:20px;
	/*border-bottom:1px solid var(--main-color);*/
	cursor: pointer;
}
.privacyBox label:hover{
	color:var(--hover-color);
}
.modal_wrap input {
  display: none;
}

.modal_overlay {
  display: flex;
  justify-content: center;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  opacity: 0;
  transition: opacity 0.5s, transform 0s 0.5s;
  transform: scale(0);
}

.modal_trigger {
  position: absolute;
  width: 100%;
  height: 100%;
}

.modal_content {
    align-self: center;
    /*box-sizing: border-box;*/
    line-height: 1.4em;
    background: #fff;
    transform: scale(0.3);
    transition: 0.5s;
    position: relative;
}
body.dark .modal_content {
    background: #000;
}
@media screen and (max-width:640px){
.modal_content {
    align-self: center;
    /*box-sizing: border-box;*/
    line-height: 1.4em;
    background: #fff;
    transform: scale(0.3);
    transition: 0.5s;
    position: absolute;
    overflow: hidden;
    overflow-y: auto;
}
}

.close_button {
  position: absolute;
  top: 20px;
  right: 16px;
  cursor: pointer;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  background:url("../images/close_icon.svg") center center no-repeat;
  background-size:30px;
}
.close_button:hover{
    background-image:url("../images/close_icon_d.svg")
}
.modal_wrap{
	color:#000 !important;
}
.modal_content{
    display: block;
    height: 90vh;
    width:80vw;
    max-width:1280px;
}
.modal_wrap input:checked ~ .modal_overlay {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.5s;
}

.modal_wrap input:checked ~ .modal_overlay .modal_content {
  transform: scale(1);
    border-radius: 10px;
}
.modal_content h2{
    line-height: 66px;
    text-align: center !important;
    border-bottom:1px solid #ccc !important;
    font-size: 28px;
    font-weight: bold;
}
body.dark .modal_content h2{
    color:#fff;
    border-bottom:1px solid #cc1e1e !important;
}
div.nextSectionWrap {
    width: 100%;
    height: calc(100% - 77px);
    display: flex;
    justify-content: center;
    align-items: center;
}
div.nextSection {
    padding:20px 40px;
    overflow-y: auto;
    width: calc(100% - 20px);
    height: calc(100% - 150px) !important;
    display: block;
    text-align: left;
    padding-right: 20px;
}
div.nextSection h3 {
    font-size:18px;
    font-weight: bold;
    color:var(--main-color);
    margin:40px 0 10px;
}
div.nextSection p{
    margin-left:100px;
}
p.button {
    width: 120px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border-radius: 4px;
    cursor: pointer;
    color: #fff;
    margin-left:none !important;
}
p.button.close {
    background: gray;
}
p.button.confirm {
    background: green;
}
p.button.confirm:hover {
    background: lightgreen;
    color: #000;
}
p.button.close:hover {
    background: lightgray;
    color: #000;
}
p.inquiry {
	width:860px;
	margin:50px auto;
}
