@charset "UTF-8";
/*--------------------------------
初期設定
---------------------------------*/
html {font-size: 62.5%;} /* 1.6rem=16px */
body {width: 100%; color: #282828; font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;line-height: 1; word-break: break-all; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt";  min-width: 320px; padding: 0px;font-weight: 500;position: relative}
a {color: #282828;transition: 1.0s;}
a:hover{opacity: .7}
a:hover img {}
img {max-width: 100%;height: auto;}
p, ul li, ol li, dl dt, dl dd{margin:0; padding:0; font-size:1.4rem}
ul,h1,h2,h3,h4,h5,h6{ margin:0; padding:0}
ul li{ margin:0; padding:0; list-style-type:none}

.pb40{ padding-bottom:40px;}
.mb60{ margin-bottom:60px!important;}
.mb40{ margin-bottom:40px!important;}
.mb10{ margin-bottom:10px!important;}
.mb15{ margin-bottom:15px!important;}
.pb20{ padding-bottom:20px;}
.pb80{ padding-bottom:80px;}
.attention,.rd{ color:#C00}
.ib{ display:inline-block}
.f-l{ float:left}
.f-r{ float: right}
.clear{ clear:both}
.w100{ width:100%}
caption{ font-size:1.6rem; padding-bottom:10px; text-align:left}
.min{  font-family: "Times New Roman", Times, serif, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; transform: rotate(.03deg);}
html{overflow-y:scroll;}
.bk{ color:#000!important}
.right{ text-align:right}
.bold{ font-weight:bold}
.clearfix::after{ content: ""; display: block; clear: both;}


.pc-mode{display: none}


/*--------------------------------
share
---------------------------------*/
img[src$=".svg"] {width: 100%; height: auto;}
a{ transition: opacity 0.5s ease-out;}
a:hover{ text-decoration:none;}
.center{ text-align:center}
.ggmap {position: relative; padding-bottom: 70.25%; padding-top: 30px; height: 0; overflow: hidden;}
.ggmap iframe,
.ggmap object,
.ggmap embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* page-top */
#pagetop {position: fixed; bottom: 20px; right: 20px; margin:0;}
#pagetop a {width: 40px; height:40px;}
#pagetop a img{width: 50px;height:50px;}
#pagetop a:hover {}
.main section, main ul li {line-height:1.8}

/* パンくず */
.BreadcrumbList{    padding:0 0 10px 0; box-sizing:border-box;
    margin: 0;text-align: right}
.BreadcrumbList li{ display:inline; font-size:1.2rem; line-height:1.4;font-weight: bold; color: #000}
.BreadcrumbList li:after {
    content: ">";
    padding: 0 5px;    color: #999;
}
.BreadcrumbList li:last-child:after {
    content: "";
}
.BreadcrumbList li a{text-decoration:none;font-weight:normal; color: #666}
.BreadcrumbList li a:hover{ text-decoration:underline}

.Pagination {
  display: flex;
  align-items: center;
	justify-content: center;
  overflow: hidden;
	padding-bottom: 60px
}
.Pagination > * + * {margin: 0 5px
}
.Pagination-Item-Link {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 45px;
  height: 45px;
	border-radius: 50%;
  font-size: 14px;
  color: #111;
  font-weight: bold;
  transition: all 0.15s linear;
}
.Pagination-Item-Link-Icon {
  width: 20px;
}
.Pagination-Item-Link.isActive {
  background: #111;
  color: #fff;
  pointer-events: none;
}
.Pagination-Item-Link:not(.isActive):hover {
  background: #111;
  color: #fff;
}

.js-fade {
    opacity: 0;
    visibility: hidden;
    transform: translateY(50px);
    transition: opacity 1s,visibility 1s, transform 1s;
}

.scroll {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}


/* btn */
.btn001{text-align: center}
.btn001 a{background: #000;display: inline-block;color: #fff;padding:15px 20px;border-radius: 50px;text-decoration: none;font-size: 1.4rem}
.btn003{text-align: center;margin-bottom: 120px;}
.btn003 a{background: #000;display: inline-block;color: #fff;padding:15px 20px;border-radius: 50px;text-decoration: none;font-size: 1.4rem}

a.anchor {
    display: block;
    padding-top: 100px;
    margin-top: -100px;
}

.btn002{ margin-right: 20px;background: #999!important}

/* header */

header { position: fixed;z-index: 10; width: 100%; background: rgba(0,0,0,0.8);}
header a{color: #fff;text-decoration: none}

header h1{height: 60px; padding: 10px 70px 10px 10px;box-sizing: border-box}
header h1 a{display: inline-block}
header h1 span{display: block;margin-bottom: 5px; font-size: 1rem;font-weight: 400}


/* nav2 */

.Nav ul li a:after{color:#339966; font-size: 1.2rem;  margin-left: 10px;font-weight: normal;}

section{clear: both; padding: 60px 20px;}
section h2{padding-bottom: 40px; font-size: 4rem;font-weight: bold}
section h3{ display: inline-block;font-size: 2.6rem;font-weight: bold; 
	  background-image: linear-gradient(-90deg, rgba(105, 234, 203, 1), rgba(215, 98, 252, 1) 67%, rgba(102, 84, 241, 1));


  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;}
section p{font-size: 1.4rem;line-height: 2}


/* .Introduction */

.Introduction{position: relative}
.Introduction p{font-size: 1.4rem; padding-bottom: 20px; line-height: 1.8;color: #fff}
.Introduction img{width: 80%; max-width: 800px;height: auto}
.Introduction h2{ padding: 100px 0;  color: #fff}
.Introduction-section{text-align: center}
.item02{
  max-width: 340px; /*画像サイズ指定*/
margin: 0 auto;}

.slide01 {
    animation-name: slide01;
    animation-duration: .3s;
    animation-timing-function: ease-out;
}
@keyframes slide01 {
    0% {
        transform: translateX(500px);
    }
    100% {
        transform: translateX(0px);
    }
}



/* .diagonal** */
.diagonal01{position: relative;text-align: left;z-index: -1}
.diagonal01::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-color: #fff;
  transform: skewY(3deg);
  transform-origin: top right;
}
.diagonal01::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-color: #fff;
  transform: skewY(-3deg);
  transform-origin: top right;
}
.diagonal02{position: relative;text-align: left;z-index: 0;margin-top: -2px;}
.diagonal02::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-color: #f4f4f4;
  transform: skewY(-3deg);
  transform-origin: top right;

}
.diagonal02::after {
}
.diagonal03{position: relative;text-align: left;z-index: 0}
.diagonal03::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-color: #fff;
  transform: skewY(3deg);
  transform-origin: top right;
}
.diagonal04{position: relative;text-align: left;z-index: 0;}
.diagonal04::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-color: #f4f4f4;
  transform: skewY(-3deg);
  transform-origin: top right
}

.section-wrap{max-width:960px;margin: 0 auto}
.about h3{padding-bottom: 20px;}
.about h3 span{display: inline-block;margin-right: 10px;
	background-image: linear-gradient(-90deg, rgba(105, 234, 203, 1), rgba(215, 98, 252, 1) 67%, rgba(102, 84, 241, 1));
  -webkit-text-fill-color: transparent;color: #fff}
.about p{padding-bottom: 40px;}

/* .activity */
.activity{padding:80px 20px 160px; }
.activity-section{}
.activity h2 img{float: right;width: 35%; height: auto;margin-top: -20px;}


/* news */
.news-list{width: 100%;padding: 50px 0 0}
.news-list li{display: block;padding: 15px ; border-bottom: 1px dotted #acacac}
.news-list li span{display: inline-block;font-size: 1.6rem;font-weight: bold;margin-right: 30px}
.news-list li div{display: inline-block;font-size: 1.6rem}
.all-list{padding-top: 40px}


/* contact */
.contact h2 img{float: right;width: 40%; height: auto;margin-top: -40px;}
.contact h3{clear: both; margin-bottom: 40px}

.contact h3 + p{padding-bottom: 40px; line-height: 1.8}
.contact h3 + p span{color: #EA0024}
.contact-form{}
.contact-form th,
.contact-form td{font-size: 1.6rem}
.contact-form td p{padding: 10px 0; font-size: 1.2rem;
}
.contact-form th{text-align: right;white-space: nowrap;vertical-align:top;padding: 10px 10px 0 0;box-sizing: border-box;}
.contact-form th span{display: inline-block;margin-left: 10px;font-weight: normal;color: #EA0024}
.contact-form td{padding-bottom:30px}
.contact-form td input,
.contact-form td textarea{width: 100%; padding: 10px 15px;box-sizing: border-box;border-radius: 40px;background: #fff;box-shadow: 1px 2px 9px -4px rgba(0,0,0,0.6);border: none;}
.contact h4{display: inline-block;padding:0 40px 30px 0 ; background:#f4f4f4;  font-size: 2.4rem;color: #000}
.contact h5{font-size: 1.4rem;padding: 30px 0 0;color: #000}
.contatc-wrap02-02{color: #939393;}
.pp-wrap{margin-top: -40px; border:2px solid #D3D3D3;border-radius: 20px;padding: 40px 30px 30px 30px;}
.pp-wrap p,
.pp-wrap ul li{font-size: 1.2rem;line-height:2}
.contatc-wrap02-01{padding-bottom: 80px;}
.contact-btn{ text-align: left;padding-left: 150px;}


/* news */
.new-contents-wrap{padding: 20px 0;}
.slider .slick-slide a{text-decoration: none}
.news-data{font-size: 1.8rem;font-weight: bold}
.news-category{position: relative;padding: 5px 0; text-align: right;}
.news-category img{display: inline-block!important;vertical-align: middle; width: 20px!important;height: 20px!important;margin-right: 10px}
.news-title{font-size: 2rem;font-weight: bold;padding-bottom: 15px}
.news-content{line-height: 1.6;color: #666}
.news-content p{padding-bottom: 15px; line-height: 1.8;font-size: 1.4rem}

/* member */
.member{padding:60px 20px 20px; background: #fff;}
.member h2 img{float: right;width: 50%; height: auto}
.member h3{clear: both; padding-bottom: 40px}

.member ul{display: flex; flex-wrap: wrap	}
.member ul li{position: relative; width: 50%;margin-bottom: 60px; padding:10px 10px 65px;box-sizing: border-box;text-align: center;}
.member .person{width: 160px;height:auto;border-radius: 50%;box-sizing: border-box;box-shadow: 1px 1px 5px #999999; }
.member .name{margin: 15px 0 10px;font-size: 1.6rem;font-weight:bold;}
.member .job{margin-bottom: 10px; color: #999;font-size: 1.2rem;}
.sns-icon{}
.sns-icon a img{width: 24px;height: 24px;}
.sns-icon a {display: inline-block; margin:0px 3px 10px;
}
.member p{width: 100%;margin: 0 auto 15px; font-weight: 400;text-align: left;line-height: 1.8}
.personArea .id_text ul{padding: 30px 0; text-align: left}
.personArea .id_text ul li {width: 100%;margin-bottom: 0; padding: 15px 0; border-bottom: 1px solid #DADADA;line-height: 1.6;text-align: left}
.personArea .id_text ul li span{display: inline-block;float: left; width: 100px;color: #588AAD;font-weight: bold}
.personArea .id_text ul li div{ margin-left: 120px;}
.personArea .sns-icon a{width: 24px;height: 24px; margin: 0 5px}
.personArea .id_text .sns{line-height: 1}
.personArea .id_photo{text-align: center}
.personArea .id_photo img{  box-shadow: 0px 1px 8px #eee;}
.member .btn001{ position: absolute;
    left: 50%;bottom: 0;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
width: 100%;
}


/* contact */
.contact{margin-top: -40px;padding-top: 100px;}


/* ページャー */


.pager .pagination2 {margin: 0 0 60px;padding: 40px 0 0; 
  text-align: center;
    display: flex;
    justify-content: space-between;
}

.pager .pagination2 li {
  margin: 0 2px;
  padding: 0;
  display: inline-block;
  text-align: center;
}


.pager .pagination2 li a{
}




footer{padding: 90px 0 30px; text-align: center;color: #fff;font-size: 1.2rem}


.sub section{padding-top: 100px}
.form-kakunin td{padding: 10px 10px 0 0;line-height: 1.8}
.form-kakunin .contact-btn{padding-top: 40px}
.sub .contact h2 img{margin-top: 0px}
.sub .contatc-wrap02-01{width: auto}
.sub > section{margin-top: 0;clip-path: polygon(0 0 , 100% 0, 100% 95%, 0 100%);}
.sub > section:before{transform: none}
.sub01 footer{padding: 35px 0 30px; }

.sub .personArea{padding-top: 0;}
.sub .personArea h4{text-align: center; font-size: 3rem;padding-top: 30px;}
.sub .personArea h4 span{display: block;padding: 10px 0 30px; font-size: 1.8rem;color: #666;font-weight: normal}




@media screen and (max-width: 600px){
}
@media screen and (min-width: 601px){
	.news-category{top: -20px;}

	
}




@media screen and (max-width: 767px){
		.contact-form { width: 100%;}
	.contact-form th {display: block;padding-bottom: 10px; text-align: left;}
	.contact-form td {display: block; text-align: left;padding-top:0;padding-bottom: 25px }
	.contact-btn{text-align: center;padding-left: 0	}

}

@media screen and (min-width: 768px){
	
	
	
	header h1{font-size: 3rem}
	header h1 span{font-size: 1.2rem;}
section h2{font-size: 6rem;}

	section p{font-size: 1.6rem;line-height: 2.4;}
	
	.Introduction p{font-size: 1.8rem; padding-bottom: 40px; line-height: 2.2;}
	.about-section{display:flex;	}
	.item02{
  width: 240px; /*画像サイズ指定*/
  padding: 50px 0 0 60px;
  overflow: hidden;
  position: relative;flex-shrink: 0;
}

.js-fade {
    opacity: 0;
    visibility: hidden;
    transform: translateY(400px);
    transition: opacity .7s,visibility 1s, transform .7s;
}

.scroll {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}

	
	section h2{padding-bottom: 80px}
	/* パンくず */
.BreadcrumbList{   padding:0 0 30px 0; box-sizing:border-box; margin: 0;text-align: right;}

/* news */	
	.news-list{width: 70%;padding:100px 0;margin: 0 auto}


/* .activity */
.activity{padding:160px 20px 160px; }
	
/* メンバー紹介 */
.member h3{padding-bottom: 80px}

/* contact */
	.contact h2 img{margin-top: -120px;}

.contact{margin-top: -65px;padding-top: 200px;}
	.contatc-wrap02{display: flex}
	.contatc-wrap02-01{width: 50%;}
	.contatc-wrap02-02{width: 50%;padding: 0 0 0 50px;}
	.pp-list-wrap{max-height: 260px;overflow-y: auto}
	
	
	.sub > section{padding-top: 100px}
	.sub .personArea{
    display: flex;flex-shrink:0;}
	.id_text{max-width: 500px;padding-left: 80px}
	
}

@media screen and (min-width: 961px){
		.sub > section{padding-top: 200px}

	@keyframes slide {
    0% {
        transform: translateX(1000px);
    }
    100% {
        transform: translateX(0px);
    }
}

.slide {
    animation-name: slide;
    animation-duration: .3s;
    animation-timing-function: ease-out;
}
	

	
}

@media screen and (min-width: 1024px) {
		
	
a.anchor {
    display: block;
    padding-top: 140px;
    margin-top: -140px;
}
.pc-mode{display: block}
.sp-mode{display: none}
	
	body{}
	a{transition: all .3s;}
	a:hover{opacity: .75}
	a[href*="tel:"] {pointer-events: none;cursor: default;}

	header h1{height: 100px;padding-top: 26px;}
	header h1 span{margin-bottom: 10px	}
	.header-wrap{display: flex;justify-content: space-between;padding: 0 40px	}
	
	.Nav ul li a:after{display: block; margin-left:0; text-align: center; margin-top: 8px;}
	.Nav ul li a:hover{opacity: .7}
	
	section{padding: 100px 0 50px}
	section.Introduction {padding-bottom: 160px;padding-left: 80px 	}
	
	
	
	/* activity */
.activity-section{}
	.item02{
  width: 340px; /*画像サイズ指定*/
}.activity h2 img{margin-top: -40px;}

	/* member */
	.member{padding: 100px 10px 160px;}
	.member ul{max-width: 1200px;margin: 0 auto}
	.member ul li{padding-bottom: 80px;width: 25%;}
	.member .name{margin: 20px 0 10px; font-size: 1.6rem}
.member .job{margin-bottom: 10px; font-size: 1.2rem;}
.member p{}
.member .sns-icon{}
	


	/* contact */
	
	
	/* メンバー紹介 */
.title-img{height: 300px;}
.title-img h2{padding-top: 160px;
    font-size: 4rem;text-shadow:0px 1px 3px #000 }
	
	
	
	
}

@media screen and (min-width: 1200px){
	
	.header-wrap{padding: 0 69px;}
	header h1,.hamburger-nav-list > li a{letter-spacing: 0.04em;}
.contact{margin-top: -100px;}


}

@media screen and (min-width: 1260px){
	
		.header-wrap{padding: 0 80px;}

}