@charset "UTF-8";

#loader-bg {
	position: fixed;
	width: 100%;
	height: 100%;
	background:#E6EFF1;
	z-index: 1;
}
#loading {
	position: relative;
}
#loading img {
	position: absolute; 
	top: 250px;
	left: 0;
	right: 0;
	margin: 0 auto 0;
	width: 150px;
}
@media screen and (max-width: 767px) {
#loading img {
	position: absolute; 
	top: 180px;
	left: 0;
	right: 0;
	margin: 0 auto 0;
	width: 100px;
	}
}

/* -- slider ----------------------------------------------------------------*/
.headline { background: #f4f4f4; border-bottom: #dedede 1px solid; }
#slider li .pc { position: relative; }

@media screen and (max-width: 767px) {
	.bx-wrapper { margin-bottom:2%; }
	.bx-viewport { margin-bottom:0px; }	
}


@media screen and (min-width: 768px) and (max-width: 960px)  {
	.bx-wrapper { margin:0 0% 50px; height: 480px; overflow: hidden; }
	.bx-wrapper video { width: 100%; height: 480px; object-fit: cover; object-position: 100% 100%; }
	#slider li.slide01 .copy-main { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide02 .copy-main { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide03 .copy-main { position: absolute; bottom: 30px; right: 20px; }
}
@media screen and (min-width: 961px) and (max-width: 1199px)  {
	.bx-wrapper { margin:0 0% 50px; height: 550px; overflow: hidden; }
	.bx-wrapper video { width: 100%; height: 550px; object-fit: cover; object-position: 100% 100%; }
	#slider li.slide01 .copy-mainr { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide02 .copy-main { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide03 .copy-main { position: absolute; bottom: 30px; right: 30px; }
}
@media screen and (min-width: 1200px) and (max-width: 1399px) {
	.bx-wrapper { width:1100px; margin:0 auto 60px; height: 550px; overflow: hidden; }
	.bx-wrapper video { width: 100%; height: 550px; object-fit: cover; object-position: 100% 100%; }
	#slider li.slide01 .copy-main { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide02 .copy-main { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide03 .copy-main { position: absolute; bottom: 30px; right: 30px; }
}
@media screen and (min-width: 1400px) and (max-width: 1559px) {
	.bx-wrapper { width:1260px; margin:0 auto 80px; height: 550px; overflow: hidden; }
	.bx-wrapper video { width: 100%; height: 550px; object-fit: cover; object-position: 100% 100%; }
	#slider li.slide01 .copy-main { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide02 .copy-main { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide03 .copy-main { position: absolute; bottom: 30px; right: 30px; }
}
@media screen and (min-width: 1560px) {
	.bx-wrapper { width:1500px; margin:0 auto 100px; height: 550px; overflow: hidden; }
	.bx-wrapper video { width: 100%; height: 550px; object-fit: cover; object-position: 100% 100%; }

	#slider li.slide01 .copy-main { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide02 .copy-main { position: absolute; bottom: 30px; right: 20px; }
	#slider li.slide03 .copy-main { position: absolute; bottom: 30px; right: 30px; }
}


/* -- APPEND ----------------------------------------------------------------*/








@media screen and (max-width: 767px) {
	section { }
	section h2 { text-align: center;  font-family:'Roboto', sans-serif; font-weight:bold; color: #333; font-size: 21px; margin-bottom: 20px; line-height: 1.1; }
	section h2 span {  font-family: 'Noto Sans Japanese','Hiragino Kaku Gothic ProN','メイリオ', serif; font-size: 12px; color: #036eb8; display: block;}
	
	.top_service_list { padding: 4%; }
	.top_service_list li { margin-bottom: 10px;}
	.top_service_list li h3 { padding: 4%; text-align: center; font-size: 16px; font-weight: bold; color: #fff; line-height: 1.4; }
	.top_service_list li h3 span { font-family:'Roboto', sans-serif; font-weight:bold; display: block; font-size: 10px; opacity: 0.7; line-height: 2.0; }
	
	.top_service_list li:nth-child(1){
	background: #02AAB0;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #00CDAC, #02AAB0);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #00CDAC, #02AAB0); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	.top_service_list li:nth-child(2){
	background: #D31027;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #EA384D, #D31027);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #EA384D, #D31027); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	.top_service_list li:nth-child(3){
	background: #00d2ff;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #3a7bd5, #00d2ff);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #3a7bd5, #00d2ff); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	.top_service_list li:nth-child(4){
	background: #4776E6;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #8E54E9, #4776E6);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #8E54E9, #4776E6); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	.top_service_list li:nth-child(5){
	background: #ec008c;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #fc6767, #ec008c); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	
	
	#anch01 { background: url("../img/common/sec01_bg.jpg") center center no-repeat; background-size: cover; }
	#anch02 { border-top: 1px #dedede solid; border-bottom: 1px #dedede solid; }
		
	#anch02 p.box_link_btn a { color:#333; width:60%; height:25px; line-height:25px; border:#333 1px solid; display:block; text-align:center; margin:0 20%; background:#fff; font-size: 12px; }
	#anch02 p.box_link_btn a:link    { color:#333; text-decoration: none; }
	#anch02 p.box_link_btn a:visited { color:#3330; text-decoration: none; }
	#anch02 p.box_link_btn a:hover   { color:#fff;    text-decoration: none; background:#333; }
	#anch02 p.box_link_btn a:active  { color:#333; text-decoration: none; }
	
	.top_news_list li { margin-bottom: 10px; }
	.top_news_list li dl { margin-bottom: 5px; }
	.top_news_list li dl dt { font-size: 12px; color: #fff; background: #333; border: 1px solid #333; float: left; padding: 2px 5px; width:80px; text-align: center; }
	.top_news_list li dl dd { font-size: 12px; color: #333; background: #fff; border: 1px solid #333; float: left; padding: 2px 5px; width:80px; text-align: center; }
	.top_news_list li p { font-size: 14px; }
}
@media screen and (min-width: 768px) {
	section h2 { text-align: center;  font-family:'Roboto', sans-serif; font-weight:bold; color: #333; font-size: 24px; margin-bottom: 20px; line-height: 1.1; }
	section h2 span {  font-family: 'Noto Sans Japanese','Hiragino Kaku Gothic ProN','メイリオ', serif; font-size: 12px; color: #036eb8; display: block; }
	
	.top_service_list li { float: left; width: 31%; margin-right: 3.5%; margin-bottom: 20px;}
	.top_service_list li:nth-child(3n) { margin-right: 0px; }
	.top_service_list li h3 { padding: 4%; text-align: center; font-size: 21px; font-weight: bold; color: #fff; line-height: 1.4; }
	.top_service_list li h3 span { font-family:'Roboto', sans-serif; font-weight:bold; display: block; font-size: 14px; opacity: 0.7; line-height: 2.0; }
	
	.top_service_list li:nth-child(1){
	background: #02AAB0;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #00CDAC, #02AAB0);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #00CDAC, #02AAB0); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	.top_service_list li:nth-child(2){
	background: #D31027;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #EA384D, #D31027);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #EA384D, #D31027); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	.top_service_list li:nth-child(3){
	background: #00d2ff;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #3a7bd5, #00d2ff);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #3a7bd5, #00d2ff); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	.top_service_list li:nth-child(4){
	background: #4776E6;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #8E54E9, #4776E6);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #8E54E9, #4776E6); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	.top_service_list li:nth-child(5){
	background: #ec008c;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #fc6767, #ec008c); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	}
	
	#anch01 { background: url("../img/common/sec01_bg.jpg") center center no-repeat; background-size: cover; }
	#anch02 { border-top: 1px #dedede solid; border-bottom: 1px #dedede solid; }
	
	#anch02 .news_L { float: left; width: 16%; margin-right: 4%; }
	#anch02 .news_R { float: left; width: 80%; }
	#anch02 .news_L  h2 { text-align: center; margin: 0 0 20px; }
	#anch02 .news_L  p { text-align: center; }
	
	#anch02 .news_L  p.box_link_btn a { color:#333; width:60%; height:25px; line-height:25px; border:#333 1px solid; display:block; text-align:center; margin:0 20%; background:#fff; font-size: 12px; }
	#anch02 .news_L  p.box_link_btn a:link    { color:#333; text-decoration: none; }
	#anch02 .news_L  p.box_link_btn a:visited { color:#3330; text-decoration: none; }
	#anch02 .news_L  p.box_link_btn a:hover   { color:#fff;    text-decoration: none; background:#333; }
	#anch02 .news_L  p.box_link_btn a:active  { color:#333; text-decoration: none; }
	
	.top_news_list li { margin-bottom: 10px; }
	.top_news_list li dl { float: left; margin-right: 20px; }
	.top_news_list li dl dt { font-size: 12px; color: #fff; background: #333; border: 1px solid #333; float: left; padding: 2px 5px; width:80px; text-align: center; }
	.top_news_list li dl dd { font-size: 12px; color: #333; background: #fff; border: 1px solid #333; float: left; padding: 2px 5px; width:80px; text-align: center; }
	.top_news_list li p { float: left; }
}
@media screen and (min-width: 768px) and (max-width: 960px)  {
	section { padding: 30px; }
	section h2 { font-size: 30px;  }
	section h2 span { font-size: 13px; }
	
	.top_service_list { margin: 0 0%; }
	.top_service_list li { float: left; width: 32%; margin-right: 2%; margin-bottom: 20px;}
	.top_service_list li h3 { font-size: 16px; }
	.top_service_list li h3 span { font-size: 12px; }

	#anch02 .news_L { float: left; width: 21%; margin-right: 4%; }
	#anch02 .news_R { float: left; width: 75%; }
	
	.top_news_list li dl { float: none; margin-bottom: 10px; }
	.top_news_list li p { float: none; }
}
@media screen and (min-width: 961px) and (max-width: 1199px)  {
	section { padding: 40px; }
	section h2 { font-size: 36px; margin-bottom: 30px;  }
	section h2 span { font-size: 14px; }
	
	.top_service_list li { float: left; width: 32%; margin-right: 2%; margin-bottom: 20px;}
	.top_service_list { margin: 0 0%; }
	.top_service_list li h3 { font-size: 18px; }
	.top_service_list li h3 span { font-size: 13px; }
}
@media screen and (min-width: 1200px) and (max-width: 1399px) {
	section { padding: 40px; }
	section h2 { font-size: 40px; margin-bottom: 40px;  }
	section h2 span { font-size: 15px; }
	
	.top_service_list { margin: 0 2%; }
	.top_service_list li { margin-bottom: 40px; }

	.top_service_list li h3 { font-size: 18px; }
	.top_service_list li h3 span { font-size: 13px; }
}
@media screen and (min-width: 1400px) and (max-width: 1559px) {
	section { margin-bottom: 40px; padding: 40px; }
	section h2 { font-size: 45px; margin-bottom: 40px;  }
	section h2 span { font-size: 15px; }
	
	.top_service_list { margin: 0 4%; }
	.top_service_list li { margin-bottom: 40px; }
}
@media screen and (min-width: 1560px) {
	section { padding: 60px; }
	section h2 { font-size: 48px; margin-bottom: 40px; }
	section h2 span { font-size: 15px; }
	
	.top_service_list { margin: 0 4%; }
	.top_service_list li { margin-bottom: 40px; }
}


/*-- コンテンツ -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	section .in { padding: 4%; }
}
@media screen and (min-width: 768px) {
}
@media screen and (min-width: 768px) and (max-width: 1199px)  {
	section .in { margin:0 1%; }
}
@media screen and (min-width: 1200px) and (max-width: 1399px) {
	section .in { width:1100px; margin:0 auto; }
}
@media screen and (min-width: 1400px) and (max-width: 1559px) {
	section .in { width:1260px; margin:0 auto; }
}
@media screen and (min-width: 1560px) {
	section .in { width:1500px; margin:0 auto; }
}


/*  -- 20201014  ----------------------------------------------------------------*/

.headline #slider li.slide01:after{
  background-image:url("../img/common/over/pattern-02.png");
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
}
.headline #slider li.slide02:after{
  background-image:url("../img/common/over/pattern-02.png");
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
}
.headline #slider li.slide03:after{
  background-image:url("../img/common/over/pattern-02.png");
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
}


/* -- 20201014 ----------------------------------------------------------------*/