@charset "UTF-8";
 /*section background*/

#lineup {
  background:#f0f0f0;  
}
#news {
    background: #f9f9f9;
}
#introduction{background: #fff;}
#new_news {
	padding:1em 0;
    background: #ecefef;
}

/*================================================
 *  メインビジュアル
 ================================================*/
#top_main{

margin:0px auto;
border-top:1px #eee solid;
/*height: 510px;*/
}
.swiper-container {
	width: 100%;
}

.swiper-slide {
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	box-sizing: border-box;
}

.top_inner {
    max-width: 1200px;
    /*width: 83.3%;*/
	width:90%;
    margin: auto;
	padding:120px 0;
	color:#fff;
	position:relative;
	
}
	.swiper-slide01{
	width: 100%;
	background:url("/images/top_main/main_image33.jpg") no-repeat center center;background-size: cover;
	/*background:url("/images/top_main/main_image31.jpg") no-repeat center center;*/
	}
	/*.swiper-slide02{
	width: 100%;
	background:url("/images/top_main/main_image29.jpg") no-repeat center center;
	background-size: cover;
	}*/
	.swiper-slide03{
	width: 100%;
	background:url("/images/top_main/main_skuid_v2_min.jpg") no-repeat center center;
	background-size: cover;
	}
	.swiper-slide04{
	width: 100%;
	background:url("/images/top_main/main_image32.jpg") no-repeat center center;
	background-size: cover;
	}
	.top_inner .hl_h2 {
			/*text-align:center;*/
			font-size:2.2em;
			font-weight:600;
			line-height:1.4;
			margin:0 auto;
	}
	.top_inner p {
			font-size:1.6em;
			line-height:1.8;
			margin: 0 0 .5em;
			/*text-align:center;*/
	}
	.top_inner p.subtitle {
		margin: 0 auto;
		 padding:0px 0 10px 0;
		}	
	.top_inner p.subtitle span{
		border:1px #fff solid;
		padding:2px 18px;
		border-radius:18px;
		color:#fff;
		margin-bottom:5px;
			font-size:.8em;
		}

	.top_inner p img.skuid{
		/*margin:0 auto;*/
		height:3em;
	}
	.top_inner p.skuid-txt {font-size:.9em;line-height:0;margin:.3em auto 0}
	
	/*CSSボタンエリア・サイズ*/
		.top_inner a.hd-btn {

  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	
    border-radius: 80px;
    font-size: 1.8em;
	font-weight: 500;
    line-height: 1;
    display: inline-block;
    min-width: 230px;
	max-width: 480px;
    padding: 2% 3%;
    color:#fff;
    border:3px solid #fff;
			text-align:center;
			margin-bottom:.4em
			/*
			border:none;
			text-decoration:none !important;
			display: inline-block;
			margin:0.2em auto;
			
			width:100%;
			
			position: relative;
			padding:0.7em 0.9em;
			transition: background 0.2s ease 0s;
			font-size:1.8em*/
			}

	.top_inner a.hd-btn:hover{

		background:rgba(255,255,255,0.3);
		transition: background 0.2s ease 0s;
	  font-weight:500;
	  text-decoration:none;
	 
	}
	.top_inner a.targetblank:after{
		color:#fff;
	}
.bnr_no1{position: absolute;bottom: 20%;right: 0;text-align:right;padding:0;margin:0;}
.bnr_no1 img{ display:block}
.bnr_notes{font-size:8px;color:#E5E5E5;text-align: right;display: block}
@media screen and (max-width:1024px) {
	.top_inner {
	  padding: 40px 2.2em;}
	.bnr_no1{position: absolute;bottom: 10%;right:1em;width:305px}
	.bnr_no1 img{ }
}
@media screen and (max-width:768px) {
/*.top_inner {
	  padding: 40px 0;
	width:90%;

	}*/
	.bnr_no1{position: absolute;bottom: 15%;right:1rem;width:215px}
	.bnr_no1 img{ }

	.top_inner .hl_h2 {
			font-size:1.8em;
	}
	
	#top_main .top_inner p {
		font-size:1.2em;
	}

	.top_inner p.skuid-txt {font-size:0.7em !important;}
	#top_main .swiper-slide01,
	#top_main .swiper-slide02,
	#top_main .swiper-slide03,
	#top_main .swiper-slide04,
	#top_main .swiper-slide05{
	background-size:cover;
	background-position:40%;
	}
}

@media screen and (max-width:480px) {
#swiper-arrow{ display:none !important; }
#top_main {
	height:auto
}
	.top_inner {
	  padding: 60px 1em;

	}
	#top_main .top_inner p img.skuid{
		/*margin:1em auto;*/
		display:block;
	}
	.top_inner p.skuid-txt {line-height:150%;margin:0 auto}

		.top_inner a.hd-btn {
			max-width: 360px;
			padding:0.5em;
			font-size: 1.4em;
			}

	#top_main .top_inner p.skuid-txt {margin:0 auto 1em auto;font-size:0.6em;}
	.bnr_no1{position: absolute;top:0;right:0;width:165px}

}

/* 帯 */

.obi{padding:28px 0;box-shadow: 0 1px 3px rgba(0,0,0,0.61);background: rgba(3,92,159,0.94); }
.obi div a{color:#fff}
.obi div a:hover{background: none;text-decoration: underline}
.obi div a.targetblank:after{color:#fff}
.obi span {border:2px #fff solid;padding:12px; text-align: center;color: #fff}
@media screen and (max-width:1024px) {
.obi span {display:block;/*max-width:86%;*/margin: auto;padding:8px;margin-bottom: 0.5em}
}
/*================================================
 *  サービス
 ================================================*/

a.top_service{
	background:#fff;
	box-shadow: 0 2px 3px rgba(0,0,0,0.21);
	}
a.top_service:hover{
    transition: 0.35s cubic-bezier(0.4,0,0,1);
    opacity: 0.6;
}
	a.top_service h2{
		font-size:1.5em !important;
		padding:0;
		line-height:1.2;
		font-weight:bold;
		text-align:center;
		color: #25254f
		}
	a.top_service .ht {background: #005eae;color:#fff;letter-spacing: 2px;padding: 20px 10px 15px;text-align: center;margin-bottom: 0;}
	a.top_service .ht > .subti {
		margin: 0 auto;
		}	
	a.top_service .ht > .subti span{
	border: 1px #fff solid;
    padding: 3px 11px;
    border-radius: 18px;
    color: #fff;
    margin-bottom: 5px;
    font-size: 1em;
    letter-spacing: .7px;
		}

		.top_service .hl_img{display:block;text-align:center;}
		.top_service .hl_img img{width:100%;}
		.top_service p{
			color:#666;
			/*line-height:190%;*/
			}	
		a.top_service h3{
			font-size: 1.5em !important;
			letter-spacing: 1.4px;
			padding: 0;
			line-height: 1.2;
			font-weight: 500;
			text-align: center;
			color: #fff;
			margin-bottom:.5em;white-space: nowrap
			}
		.top_service p img{ width:30%;float:left}


	/*CSSボタンエリア・サイズ*/
	.top_btn_sv {padding:0 0.8em;margin:1em auto;}
		.top_btn_sv:after {
		   content:'';
		   display:block;
		   clear:both;
		}
		.top_btn_sv a.btn{
			color:#fff;
			text-align:center;
			text-decoration:none;
		}
		.top_btn_sv a.hd-btn{
			display: block;
			width: 45.62%;
			 font-size: 1em;
			float: left;
			margin: 0 .5em;
		}
		.top_btn_sv a.hd-btn_l{
			display:block;
			width:100%;
			padding:.8em;
			font-size:1em;
			margin:0 auto;
			
		}
			.top_btn_sv a.hd-btn_l:before {
				font-family: "Font Awesome 5 Free";
				font-weight: bold;
				content: "\f35a";
				text-decoration:none;
				margin-right:5px;
			}

	.link {padding:0;}
	.link a {
		font-size:0.9em;
		margin-right:0.5em;
		
		}
	.link a:before{
		font-family: "Font Awesome 5 Free";
		font-weight:bold;
		content: "\f0a9";
		color:#005eae;
		padding-right:0.3em;
		}
@media screen and (max-width:1280px) {
	a.top_service .ht > .subti span{
    font-size: .82em;
		}

	.top_btn_sv {padding:0 0.8em;margin:1em auto;}
		.top_btn_sv a.btn{
			color:#fff;
			text-align:center;
			text-decoration:none;
		}
		.top_btn_sv a.hd-btn{
			width:90%;
			float:none;
			margin:1em auto;
			
		}
		.top_btn_sv a.hd-btn_l{
			width:90%;
			margin:0 auto;
			
		}
}

@media screen and (max-width:1024px) {
	a.top_service .ht > .subti span{
    font-size: .77em;
		}
		a.top_service h3{
			font-size: 1.4em !important;
			}

}
@media screen and (max-width:768px) {
	a.top_service .ht > .subti span{
    font-size: .77em;
		}
		a.top_service h3{
			font-size: 1.5em !important;
			}

}

/*================================================
 *  導入/スタッツ
 ================================================*/

.statss {background:#112a53;color:#fff;width:100%}
.statss .cnt { font-weight:bold;font-size:52px;margin:0px auto;text-align:center;line-height:120%;}
.statss .cnt span {font-size:14px;line-height:90%;}
.statss p { text-align:center;}
	
.caselink { font-weight:bold;font-size:18px;}
.top_ex{
		padding:1em 3em;
		text-align:center;
		font-size:1.3em;
	}
@media screen and (max-width:1280px) {
	.statss .cnt { font-size:2.2em;}
	.statss .cnt span {font-size:10px;}
}

@media screen and (max-width:768px) {
	.statss .cnt { font-size:2.2em;}
	.statss .cnt span {font-size:12px;}
	.statss p {font-size:0.73em;}
	.stats li,.stats li:last-child{width: 94%;float:none;margin:0 auto 1em auto;}
}


/*================================================
 *  特徴
 ================================================*/

.top_feature{
width: 100%;height:100vh;height: 500px;position: relative;}
.featured-1 {background: url(/images/top_main/main_image29.jpg)center right;background-size: cover;}/*images/top_main/istockphoto-851975000.jpg*/
.featured-2 {background: url(/images/top_main/main_image35-min.jpg)center;background-size: cover;}
.featured-3 {background: url("/images/top_main/feature_support.jpg")center;background-size: cover;}

.top_feature .inner{position: relative;width: 100%;height: 100%;background:rgba(0, 0, 0, 0.4);/*background:rgba(0, 76, 135, 0.4)*/ /*linear-gradient(45deg, rgba(0, 123, 113, 0), rgba(255, 255, 255, 0.3))*/background-size: 600% 600%;}
.top_feature .inner .desc-txt{width: 800px;height: 320px;padding: 30px;box-sizing: border-box;background:rgba(0, 91, 172, 0.29);box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.2);position: absolute;z-index: 2;top: 50%;}
.top_feature .inner .desc-txt_ml{left: 20%;transform: translateY(-50%) translateX(-20%);}
.top_feature .inner .desc-txt_mr{right: 20%;transform: translateY(-50%) translateX(20%);}

.top_feature .inner .desc-txt h3{text-align: left;color: #fff;font-size: 26px;line-height: 1.6em; font-weight: 500;letter-spacing: 0.2em;margin: 10px 0;position: relative;}
.top_feature .inner .desc-txt p{ font-size: 16px;font-weight: 200;letter-spacing: 0.03em;color: #fff;line-height: 2em;}
.top_feature .inner .desc-txt p a{ color: #fff;}
.top_feature .inner .desc-txt p a.marker{ background:linear-gradient(transparent 70%, #777 0%);}

/*--ポタン　色・基本サイズ--*/
.top_feature .inner .desc-txt a.btn-default{
position: relative;
  display: inline-block;
  font-weight: 500;
	text-align: center;
	text-decoration: none;
	-moz-transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
	z-index: 1;
  text-align: center;
  vertical-align: middle;
  padding: 12px 0;
  font-size: 1rem;
  line-height: 1.5;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
color:#fff;
}
.top_feature .inner .desc-txt a.btn-default:before {
	font-family: "Font Awesome 5 Free";
	font-weight: bold;
	content: "\f35a";
	text-decoration:none;
	margin-right:5px;
}
.top_feature .inner .desc-txt a.btn-default:hover {
		color:rgba(255,255,255,.8);
		transition: color 0.2s ease 0s;
}
/*a.btn-info {
    color:#053b62;
    border:2px solid #053b62;
}
a.btn-info:hover {
	background: #053b62;
		color:#fff;
		transition: background 0.2s ease 0s;
}*/

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

.top_feature{
min-height: 408px;
    height: 408px;}
.top_feature .inner{height: 100%;}
 .top_feature .inner .desc-txt{
    width: 100%;
    max-height: 280px;
    padding: 20px;
    transform: none;
    left: 0;
    top: 31.333%;

	}
.top_feature .inner .desc-txt h3{font-size: 22px;font-weight: 500;margin: 0;}
.top_feature .inner .desc-txt p{ margin-top:1em;}
}
@media screen and (max-width: 768px) {
.top_feature .inner .desc-txt h3{font-size: 22px;}
.top_feature .inner .desc-txt p{ margin-top:1em;}
}
@media screen and (max-width: 480px) {
 .top_feature{height: 538px;}
.top_feature .inner .desc-txt{

	max-height: 370px;
    height: 100%;
    /* top: 27.333%; */
    padding: 10% 5%;}
.top_feature .inner .desc-txt h3{font-size: 20px;padding-bottom:1em}
.top_feature .inner .desc-txt p{ font-size:.9em;margin: 0}
}


/*================================================
 *  新着情報
 ================================================*/

/*--ニュースフィード--*/
.alert {margin:0 auto 1em auto;text-align:right}
dl.info {
    margin:0 0 4em;	letter-spacing: 1px;
}
dl.info dt {
    clear: both;
    float: left;
    width: 294px;
    padding: 1em 0 0 0;
    font-size:1.1em !important;
}
dl.info dt span {
    margin-right:0.5em;
    font-size:1em !important;
	background: #fff;
}
dl.info dt span a {
    clear: both;
    display: block;
    float: left;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    width: 144px;
}
dl.info dt span a:hover {
    text-decoration: none;
	opacity: .8
}

dl.info dd {
    border-bottom: 1px dotted #c5c5c5;
	font-size:1.1em;
    padding: 1em 0 1.2em 30%;
}

	dl.info dd span.ico_new {
		/*display: inline-block;
		float:right;*/
		background: #df002c;
		padding: 2px 4px;
		margin-left: 5px;       
		vertical-align: middle; 
		font-size: 0.5em;
		font-weight: bold;
		color: #fff;
	}

		dl.info dd a[target="_blank"] {
		padding-right:0px;
		margin-right:0.3em;
		position:relative;
		}

			dl.info dd a[target="_blank"]:after{
				font-family: "Font Awesome 5 Free";
				content: "\f2d2";
				font-weight: bold;
				padding-left: 5px;
				text-decoration:none;color: #005eae;
			}
			dl.info dd a[target="_blank"] :hover {
				text-decoration:none;
				background:#f3f3f3
			}

	/*一覧へ*/
	#news span{
		margin-left:1em;
		font-size:0.4em;
	}

/*ビジュアル下の1行表示*/
#new_news .container{position: relative}
#new_news dl.info{margin:0;width:100%;font-size:.9em}
#new_news dl.info dt:nth-of-type(n+2),
#new_news dl.info dd:nth-of-type(n+2){display:none}
#new_news dl.info dd{
	border-bottom:none;
	text-overflow: ellipsis;
	white-space: nowrap;
	/*max-width: 520px;*/
    overflow: hidden;
    padding: 1em 9em 1.2em 0
}



	#new_news .news-list{
		position: absolute;top:60%;right:1%;font-size:.8em
	}
/*メンテ障害*/
.alert {margin:0 auto 1em auto;text-align:right}
@media screen and (max-width:1024px) {
	.alert {font-size:0.7em;margin-right:0.5em}
}
@media screen and (max-width:1200px) {
dl.info dt {
    /*width: 36%;*/
}
	dl.info dd {
    padding: 1.2em 0 1.2em 36%;
}
#new_news dl.info dd{
    padding: 0 0 .8em .5em;
}

}
@media screen and (max-width:1024px) {
		dl.info {
			margin:0 auto 2em auto;
			width:96%
		}
		dl.info dt {
			float: none !important;
			padding: 1em 0 0 0;
			width: 100%;
		}
		dl.info dd {
			border-bottom: 1px dotted #c5c5c5;
			margin-right:1em;
			padding: 0px 0 1em 0px;
		}
		.ico_new {
			float:none;
		}

		#news span{
			margin-left:1em;
		}
	#new_news .news-list{
		position: absolute;top:0%;right:1%;font-size:.8em
	}
}
@media screen and (max-width:480px) {
dl.info {
	margin:1em 0
}
dl.info dt {
	float: none !important;
	padding:0;
	width: 100%;
}
dl.info dd {
    padding: .5em 0 1.2em;
	font-size:1em;
	margin-bottom: 1em;text-overflow: ellipsis;
white-space: nowrap;
    overflow: hidden;
}
dl.info dt span {
	font-size: 0.8em !important;

}

	#new_news dl.info dd {
		padding: .5em 0 1.2em 0;
	}
	#new_news .news-list{
		position: absolute;top:78%;
		right:1%;font-size:.8em;
	}

}
	.news a,.media a,.sem_event a,.seminar a{
		/*background-color: #005eae;*/
		border:1px #005eae solid;
		color:#005eae;
		background: #fff
		
	}
	.incident a {
		border:1px #F97252 solid;
		color: #F97252;
	}
	.mainte a {
		border:1px #979ba2 solid;
		background-color: #979ba2;
	}
	.press a,
	.worldinfo a{
		/*background-color: #8CC3EA;*/
		border:1px #8cc3ea solid;
		color:#8cc3ea;

		
	}
	.campaign a {
		background-color: #cc88ce;
	}
	/*.media a,
	.media{
		background-color: #559658;
	}
	.sem_event a,
	.sem_event{
		background-color: #95b95b;
	}*/

.subti {
    margin: 0 auto 1em;
    padding: 0;
    text-align: center;
}
	.subti span {
    border: 1px solid #fff;
    color: #fff;
    padding: 4px 18px;
    border-radius: 15px;
    font-size: .9em;
}
.adjust-box {
    position: relative;
    width: 100%;
    height: auto;
    background: #d6effd;border-radius: 50%;
}
.box-1x1:before {
    content: "";
    display: block;
    padding-top: 100%;
}
.adjust-box .inner {
    position: absolute;
    top: 45%; 
    left: 0;
    width: 100%;
    /*height: 100%;*/

  -webkit-transform: translateY(-45%);
  transform: translateY(-45%);

 margin: 0 auto;/* ←円を中央揃え */
    text-align: center;/* ←文字を左右に中央揃え */
}


.adjust-box .inner .cnt {font-weight:700;font-size:4vmax;margin:0px auto;}
.adjust-box .inner .cnt span.cnt_small {font-size:1.6vh;line-height:120%;display: block}
.adjust-box .inner .cnt span.cnt_middle {font-size:2vh}

*::-ms-backdrop, .adjust-box .inner .cnt {
  font-size:3em;
}


@media (max-width: 1200px) {
.adjust-box .inner .cnt {font-size:3.6vmax;}
.adjust-box .inner .cnt span.cnt_small {font-size:1vh}
.adjust-box .inner .cnt span.cnt_middle {font-size:1vh}
	
	}
@media (max-width: 992px) {	
.adjust-box .inner .cnt {font-size:5vmax;}
.adjust-box .inner .cnt span.cnt_small {font-size:1.5vh}
.adjust-box .inner .cnt span.cnt_middle {font-size:2vh}
}

@media (max-width: 560px) {
.adjust-box .inner .cnt {font-size:3vmax;}
.adjust-box .inner .cnt span.cnt_small {font-size:1vh;}
.adjust-box .inner .cnt span.cnt_middle {font-size:1vh}
	}


/*ティッカー
.ticker{margin:0.5em auto;}
	.ticker li {
		font-size:1em;
		width:70%;
		margin:0em auto;
	}
	.ticker li span{
		display: inline-block;
		text-align: center;
		background: rgba(255,255,255,0.5);
		font-weight: lighter;
		padding: 0.5em 0.8rem;
		border:1px #df002c solid;
		color:#df002c;
		border-radius: 2px;
		font-size: 0.9em;
		margin-right: 1rem;
	
	}
@media screen and (max-width:1024px) {
	.ticker li {width:90%;}
}
@media screen and (max-width:480px) {
.ticker li span{
	width:30%;
	display: block;
	margin:auto;

	}
}*/
/*インシデントトピック
.news_incident{
	width:980px;
	margin:20px auto 0px auto;
	font-size:18px;
	border:1px #dd4f4d solid;
	border-radius: 3px;
	padding:3px;
	text-align:center;
	}
	.news_incident a {
		color:#dd4f4d;
		font-weight:bold;
		}
*/