@charset "utf-8";
/* CSS Document */


/*base■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
html,body,h1,h2,h3,h4,h5,h6,p,li{	
	font-family: roboto,"Noto Sans JP" , "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
}
.grecaptcha-badge { visibility: hidden; }
.page-id-9 .grecaptcha-badge { visibility: visible; }

.box-link{	
	background-color: #c00000;
	color:#fff;
	text-align:center;
	padding-left: 32px;
	padding-right: 24px;
	display: inline-block;
	font-size:13px;
	position: relative;
	height:40px;
	line-height:42px;
	border-radius: 2px;
}
.box-link:hover{
	background-color: #990000;
	color:#fff;
}

.box-link::before{
	left: 6px;
	width: 6px;
	height: 6px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
p , li {
	font-size:14px;
}
#content{
	padding-top: 80px!important;
}
.inspiro-front-page #content{	
	padding-top: 20px!important;

}
.navbar-nav>li.current-menu-item>a, .navbar-nav>li.current-menu-parent>a, .navbar-nav>li.current_page_item>a {
	color: #c00000!important;
}

/*header■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.has-header-image .navbar , .has-header-video .navbar {
    background: linear-gradient(rgba(0, 0, 0, 0.6) 1%, rgba(0, 0, 0, 0.6) 100%) 0px 0px repeat-x;
}
.headroom--not-top .navbar {
    background: rgba(0, 0, 0, .9) !important;
}
.custom-logo-link{
	line-height: 1.0;
	padding-bottom: 0px;
	padding-top: 4px;
}
.navbar .header-logo-wrapper {
    max-width: 80%;
}
.navbar {
    padding: 10px 0;
}
.header-contact {
	display: none;
	padding: 0px 14px;
	line-height: 32px;
	height:30px;
	border-radius: 15px;
	text-align: center;
	background-color: #c00000;
	font-size:13px;
}
.futter-contact , .side-contact{
	display: inline-block;
	padding: 0px 14px;
	line-height: 32px;
	height:30px;
	border-radius: 15px;
	text-align: center;
	background-color: #c00000;
	font-size:13px;
	color:#fff;
}
.header-contact:hover , .futter-contact:hover , .side-contact:hover{
	background-color: #ffffff;
	color:#c00000 !important;
}


/*hero■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
body.has-header-image .site-description, body.has-header-video .site-description {
    opacity: 1.0;
	letter-spacing: 0.25em!important;
	font-size: 13px;
}
.site-title a span:nth-child(1) , .site-title a span:nth-child(9){
	color:#c00000;
}
.site-title {
        font-size: 9vw;
    }

/*futter■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.site-info{
	text-align: center;
}
.site-info a:hover {
    color: #c00000;
}
.site-info .copyright {
	text-align: center;
	display: block;
}
.side-nav .navbar-nav li a:active, .side-nav .navbar-nav li a:hover {
        color: #c00000;
}

/*front■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.front-main{
	text-align: center;
	padding: 20px 0px 40px 0px;
}
.front-main h4{
	font-size:14px;
	color: #c00000;
	font-weight: 600;
}

.front-main .main-read{
	font-size:30px;
	font-weight: 600;
	line-height: 1.33;
	margin-bottom: 20px;
	padding-bottom: 0px;
}

.front-main p{
	font-size:14px;
}
.main-visual{
	position: relative;
	width: 95vw;
	margin-left: auto;
	margin-right: auto;
}
.main-visual-top{	
	position: absolute;
	width: 100%;
	height: auto;
	z-index: 100;
	top:0;
	left:0;
}
.main-visual-bg{
	position: relative;
	z-index: 10;
	top:0;
	left:0;
}
.main-visual-circle {
	position: absolute;
	width: 100%;
	height: auto;
	z-index: 50;
	top:0;
	left:0;
	padding-top: 15vw;
}
.circle {
	margin-left: auto;
	margin-right: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 73vw;
  height: 73vw;
  border: 2px solid #00c8ff;
  border-radius: 50%;
  box-sizing: border-box;
  animation: rotation1 35s linear infinite;
  > div {
    --a2: calc(var(--a) * 1deg - 90deg);
    --x: calc(cos(var(--a2)) * 36.2vw);
    --y: calc(sin(var(--a2)) * 36.2vw);
    position: absolute;
    translate: var(--x) var(--y);
	  
  }
}

.circle div{
	width:4vw;
	height:4vw;
  border-radius: 4vw;
	background: radial-gradient(#ffffff, #00c8ff);
  box-shadow: 0px 0px 10px 6px #fff;

}
.circle div.expansion{	
  animation: light-expansion 5s linear infinite;
}

.circle div.reduction{
  animation: light-reduction 5s linear infinite;
}
.front-to-mayekawa{
	text-align: center;
	width: 100%;
	margin-bottom: 20px;
	margin-top: 20px;
}

/*pages■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
body:not(.has-archive-description):not(.has-header-image).page .entry-title:after {
    width: 130px;
    margin: 20px auto 24px;
}
.type-page {
	padding: 5vw 0px;	
}
.type-page.has-post-thumbnail {
	padding: 0vw 0px;	
}
.page .entry-title, .page-title {
	font-size: 34px;
}

.size-full.title-image{
	width: 95%;
	height:42vw;
	overflow: hidden;
	position: absolute;
	left:0;
}
.size-full.title-image img{
	width: 100%;
	height:auto;
}
.image-indent{
	margin-top: 44vw;
}
.mayekawa-title{
	margin-top: 30px;
	border-bottom: solid 3px #222;
	margin-bottom: 10px;
	width: 100%;
	height: 54px;
	
}

.size-full.title-image{
	width: 95%;
	height:42vw;
	overflow: hidden;
	position: absolute;
	left:0;
}

.from-president-wrapper{
	width: 100%;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-top: 30px;
	padding-bottom: 30px;
	background-color: #efefef;	
	display: block;
}

.from-president-wrapper figure{
	text-align: right;
}

.from-president-wrapper h2{
	margin-top: 0px !important;
	border-left: 5px solid #fc0000;
	text-indent: 10px;
}
.from-president{	
	display: flex;
    align-items: normal;
    box-sizing: border-box;
    flex-wrap: wrap;
	gap: 20px;
}
.from-president div{
	flex-basis: 100%;
	flex-grow: 1;
    min-width: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}
.president-text figure{
	width: 45vw;
	height: auto;
	margin-left: auto;
	text-align: right;
	
}
.president-text figure img{
	max-width: auto;
	max-height: auto;
	
}

/*form■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.wpcf7{
	background-color: #efefef;
	padding: 20px 20px 10px 20px;
	margin-bottom: 15px;
	border-radius: 4px;
	}
input[type=submit]:hover {
    color: #fc0000;
    border-color: #fc0000;
}
.wpcf7 input , .wpcf7 textarea{
	border-radius: 4px;	
	border: 1px solid #ccc;
	max-width: 100% !important;
}
.wpcf7 p{
	margin-bottom: 0px !important;
}
.wpcf7 span{
    color: #fc0000;
}
input[type=phone], input[type=text], textarea  {
    box-sizing: border-box;
    display: block;
    margin-bottom: 15px;
    width: 100%;
}

input[type=email] {
    margin-bottom: 15px;
	max-width: 100%;
}
input[type=submit]{
	font-size:14px;
	font-family: roboto,"Noto Sans JP" , "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
}

/*media■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media screen and (min-width: 640px) {
body.has-header-image .site-description, body.has-header-video .site-description {
	font-size: 16px;
}
p , li {
	font-size:15px;
}
.president-text figure{
	width: 40vw;
	
}
}
@media screen and (min-width: 720px) {
.navbar .header-logo-wrapper {
    max-width: 50%;
}
.navbar {
    padding: 15px 0;
}
.header-contact{
	display: inline-block;
}
.front-main .main-read{
	font-size:40px;
}
body.has-header-image .site-description, body.has-header-video .site-description {
	font-size: 20px;
}
.circle div{
	width:35px;
	height:35px;
  border-radius: 35px;

}
.front-to-mayekawa{
	position: absolute;
	bottom:24vw;
	left:0;
	z-index: 200;
	margin-top:0px;
	margin-bottom: 0px;
}
.box-link{	
	padding-left: 40px;
	padding-right: 30px;
	font-size:15px;
	height:40px;
	line-height:42px;
}
.box-link::before{
	left: 8px;
	width: 8px;
	height: 8px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
}
.page .entry-title, .page-title {
	font-size: 45px;
}
body:not(.has-archive-description):not(.has-header-image).page .entry-title:after {
    width: 130px;
    margin: 30px auto 36px;
}
.site-title {
        font-size: 8vw;
    }
.inspiro-front-page #content{	
	padding-top: 30px!important;

}
.president-text figure{
	width: 35vw;	
}
}

@media screen and (min-width: 940px) {
.front-main .main-read{
	font-size:56px;
}
.front-main p{
	font-size:16px;
}
.from-president{	
    flex-wrap: nowrap;
}
.from-president-wrapper{
	padding-top: 40px;
	padding-bottom: 40px;
}
p , li {
	font-size:16px;
}
.wpcf7{
	padding: 40px 40px 30px 40px;
	margin-bottom: 20px;
	}
	
.site-title {
        font-size: 7vw;
    }
}
@media screen and (min-width: 1024px) {
.navbar .header-logo-wrapper {
    max-width: 45%;
}
.main-visual{
	width: 1024px;
}
.main-visual-circle {
	padding-top: 170px;
}
.circle {
	margin-left: auto;
	margin-right: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 768px;
  height: 768px;
  border: 3px solid #00c8ff;
  border-radius: 50%;
  box-sizing: border-box;
  > div {
    --a2: calc(var(--a) * 1deg - 90deg);
    --x: calc(cos(var(--a2)) * 384px);
    --y: calc(sin(var(--a2)) * 384px);
    position: absolute;
    translate: var(--x) var(--y);
  }
}
.front-to-mayekawa{
	bottom:300px;
}
.box-link{	
	padding-left: 50px;
	padding-right: 40px;
	font-size:17px;
	height:46px;
	line-height:48px;
}
.box-link::before{
	left: 10px;
	width: 10px;
	height: 10px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
}
.size-full.title-image{
	width: 90%;
	height:40vw;
}
.image-indent{
	margin-top: 42vw;
}
.from-president-wrapper{
	padding-top: 50px;
	padding-bottom: 50px;
}
body:not(.has-archive-description):not(.has-header-image).page .entry-title:after {
    width: 130px;
    margin: 40px auto 48px;
}
	
.site-title {
        font-size: 6vw;
    }
	
.inspiro-front-page #content{	
	padding-top: 40px!important;

}
.president-text figure{
	width: 280px;	
}
}

@media screen and (min-width: 1280px) {
.size-full.title-image{
	width: 90%;
}	
}

@media screen and (min-width: 1520px) {
.size-full.title-image{
	width: 85%;
}	
.image-indent{
	margin-top: 40vw;
}
}
/*animation■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
@keyframes rotation1{
  0%{ transform:rotate(0);}
  100%{ transform:rotate(360deg); }
}

@keyframes light-expansion {
0% {transform: scale(0.3,0.3);}
50%{transform: scale(1,1);}
100% {transform: scale(0.3,0.3);}
}
@keyframes light-reduction {
0% {transform: scale(1,1);}
50%{transform: scale(0.3,0.3);}
100% {transform: scale(1,1);}
}