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

/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
/*font: inherit;*/
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers
*/
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/*====================*/

*{
	position:relative;
	box-sizing:border-box;
}

body{
	font-family: 游ゴシック,メイリオ,Meiryo,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,Osaka,ＭＳ\ Ｐゴシック,MS PGothic,sans-serif;
	font-size:16px;
	line-height:1.5;
	letter-spacing:0.02em;
	font-weight: 500;
	color:#333;
}


/*記事内の画像*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em !important;
	margin-bottom: .5em !important;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em !important;
	margin-bottom: .5em !important;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto !important;
	margin-right: auto !important;
}

table.aligncenter{
	display:table;
}

table.flex_table.aligncenter,
table.flex_table.alignright,
table.flex_table.alignleft{
	float:none;
}

.btn a{
	display:inline-block;
	padding:.3em 1em;
	color:#fff;
	text-decoration:none;
	font-weight:bold;
	background:#002A63;
	border:1px solid #002A63;
	border-radius:5px;
	transition:.2s;
	cursor:pointer;
}

.btn a:hover{
	color:#002A63;
	background:#fff;
}

/* head */
#header_wrap{
	position:fixed;
	z-index:900;
	transition:.2s;
	top:0;
	right:0;
}

#header{
	display:flex;
	align-items:center;
	justify-content:flex-end;
	margin:auto;
}

#header ul{
	display:flex;
	align-items:center;
}

#header ul li{
	display:block;
	margin:0 1em;
}

#header ul li a{
	display:block;
	color:#002A63;
	font-weight:bold;
	text-decoration:none;
	transition:.2s;
}

#header ul li a:before{
	position:absolute;
	display:block;
	content:'';
	margin:auto;
	width:0;
	height:3px;
	background-color:#008A32;
	left:-10%;
	bottom:-8px;
	transition:.2s;
}

#header ul li.carrent a:before,
#header ul li a:hover:before{
	width:120%;
}

#header ul li:nth-child(5) {
	margin-right:0;
}

#header ul li:nth-child(5) a{
	padding:1em 5em;
	color:#fff;
	background-color:rgba(0,138,50,.5)
}

#header ul li:nth-child(5) a:hover{
	background-color:rgba(0,138,50,.9)
}

#header ul li:nth-child(5) a:before{
	width:0;
}

/* main image */

#main_image_wrap{
	display:flex;
	z-index:800;
}

#main_image:before{
	position:absolute;
	display:block;
	content:'';
	margin:auto;
	width:100%;
	height:100%;
	background-image:url(./img/main_image_overlay.svg);
	background-color: rgba(255,255,255,.3);
	top:0;
	left:0;
	overflow:hidden;
	z-index:990;
}

#main_image_wrap > div{
	width:calc(100% - 300px);
}

#main_image_wrap > div:first-of-type{
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	width:300px;
}

#main_image_wrap > div:first-of-type p{
	text-align:center;
	margin-bottom: 100px;
}

#main_image_wrap > div:first-of-type p a{
	display:inline-block;
	padding-right:50px;
	color:#002A63;
	text-decoration:none;
	transform:rotate(90deg);
}

#main_image_wrap > div:first-of-type p a:after {
    position: absolute;
    display: block;
    content: '';
    margin: auto;
    width: 25px;
    height: 100%;
    background-image: url(./img/arrow.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 0;
    bottom: 0;
    right: .5em;
    transition: .2s;
}

#main_image_wrap > div:first-of-type p a:before {
    display: block;
    position: absolute;
    margin: auto;
    content: '';
    padding: 10px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    left: 0;
    right: 0;
    background-color: rgba(0,138,50,.1);
    top: 0;
    bottom: 0;
    transition: .2s;
    z-index: 1;
    animation: pounding 2s linear infinite normal;
}

@keyframes pounding {
  0% {
    transform: scale(1);
    -webkit-transform: scale(1);
   opacity:0;
  }
  10% {
    transform: scale(1);
    -webkit-transform: scale(1);
   opacity:1;
  }
  100% {
    transform: scale(1.5);
    -webkit-transform: scale(1.5);
   opacity:0;
  }
}


#main_image_wrap h1 a{
	display:block;
	margin:1em auto;
	width:200px;
	height:60px;
	text-indent:-9999px;
	background-image:url(./img/logo.svg);
	background-repeat:no-repeat;
	background-size:contain;
}

#main_image p{
	height:90vh;
	text-indent:-9999px;
	background-size:cover;
	background-position:center;
}

#main_image_msg{
	position:absolute;
	margin:auto;
	padding:0 1em;
	height:80%;
	width:80%;
	text-indent:-9999px;
	background-image:url(./img/main_copy-1.svg);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:left bottom;
	bottom:30px;
	left:30px;
	z-index:1000;
}

/* top main */

#news_wrap {
	margin:0 auto 1.5em;
	padding:1em;
	max-width:1200px;
	overflow:hidden
}

#news_wrap h3{
	display: table;
	color:#002A63;
	font-size:180%;
}

#news_wrap h3:after{
	display:block;
	position:absolute;
	content:'';
	margin: auto;
	width:150%;
	height:3px;
	background-color:#008A32;
	top:0;
	bottom:0;
	left:110%;
}

#news_wrap ul{
	width:80%;
	margin:0 auto;
	margin-bottom:3em;
}

#news_wrap ul li{
	display:flex;
	border-bottom:1px dotted #ccc;
}

#news_wrap ul li span{
	padding:1em;
}

#news_wrap ul li .date{
	color: #002A63;
	font-weight:bold;
}

#news_wrap ul li:nth-child(2n) .date{
	color: #008A32;
}

#news_wrap .more{
	float: right;
}


#about_wrap{
	display:flex;
	margin-bottom:1.5em;
}

#about_wrap div{
	padding:1em 2em;
	width:100%;
	max-width:800px;
}

#about_wrap div:first-of-type{
	display:flex;
	align-items:center;
	padding:0;
	width:40%;
	max-width:100%;
}

#about_wrap div:first-of-type:after{
	display:block;
	position:absolute;
	content:'';
	width:100%;
	height:100%;
	background-image:url(./img/triangle.svg);
	background-repeat:no-repeat;
	background-size:auto 50%;
	background-position:101% center;
	top:0;
	left:0;
}

#about_wrap div img{
	width:100%;
}

#about_wrap h3{
	max-width:800px;
	font-size:600%;
	color:transparent;
	-webkit-text-stroke: 1px rgba(0,42,99,.5);
	text-stroke: 1px rgba(0,42,99,.5);
	text-shadow:-5px -3px 0 rgba(0,42,99,.5);
	text-align:right;
}

#about_wrap h4{
	font-size:300%;
}

#about_wrap div:nth-child(2) p{
	margin-bottom:1.5em;
}

#about_wrap .more{
	float:right;
	display:block;
	color:#002A63;
	background:transparent;
	border:0;
}

#about_wrap .more:after{
	background-image:url(./img/arrow.svg);
}

#about_wrap .more:hover{
	color:#fff;
	background:#002A63;
}

#about_wrap .more:hover:after{
	background-image:url(./img/arrow_white.svg);
}

#recruit_wrap{
	background-image:url(./img/recruit_bg.jpg);
	background-size:cover;
	background-position:center;
}

#recruit_wrap .cont_frame{
	display:flex;
	align-items:center;
	margin:0 auto;
	max-width:1200px;
}

#recruit_wrap .cont_frame div{
	padding:1em;
	max-width:800px;
}

#recruit_wrap .cont_frame div:first-of-type{
	width:35%;
}

#recruit_wrap div img{
	max-width:100%;

}

#recruit_wrap h3{
	max-width:800px;
	font-size:600%;
	color:transparent;
	-webkit-text-stroke: 1px rgba(0,138,50,.5);
	text-stroke: 1px rgba(0,138,50,.5);
	text-shadow:-5px -3px 0 rgba(0,138,50,.5);
}

#recruit_wrap .cont_frame > div:first-of-type p{
	margin-bottom:1.5em;
}

#recruit_wrap .more{
	display:block;
	margin:0 1em;
	background-color:#008A32;
	border:1px solid #008A32;
}

#recruit_wrap .more:hover{
	color:#008A32;
	background-color:#fff;
}

#works_wrap{
	margin:0 auto 1.5em;
	max-width:1500px;
}

#works_wrap h3{
	margin:auto;
	max-width:1200px;
	font-size:600%;
	color:transparent;
	-webkit-text-stroke: 1px rgba(0,42,99,.5);
	text-stroke: 1px rgba(0,42,99,.5);
	text-shadow:-5px -3px 0 rgba(0,42,99,.5);
	text-align:right;
}

#works_wrap > div{
	display:flex;
	flex-wrap:wrap;
}

#works_wrap div div{
	margin:1%;
	width:31.3333%;
	overflow:hidden;
}

#works_wrap div div .work_cat{
	position:absolute;
	margin:auto;
	width:50px;
	text-align:center;
	top:0;
	left:0;
	right:0;
	z-index:10;
}

#works_wrap div div .work_cat:before{
	display:block;
	position:absolute;
	content:'';
	margin:auto;
	width:100px;
	height:100px;
	background-color:#D85600;
	bottom:0;
	left:-50%;
	transform: rotate(45deg);
}

#works_wrap div div .work_cat span{
	color:#fff;
}

#works_wrap div div.cat_minkan .work_cat:before{
	background-color:#0097FC;
}


#works_wrap div div .work_image{
	width:100%;
	height:300px;
	background-size:cover;
	background-position:center;
	border-radius:25px;
	box-shadow:3px 3px 5px #aaa;
}

#works_wrap div div .work_date{
	padding:.5em;
	color:#D85600;
	font-weight:bold;
}

#works_wrap div div.cat_minkan .work_date{
	color:#0097FC;
}

#works_wrap div div .work_title{
	padding:.5em;
}


#works_wrap .more{
	float:right;
	display:block;
	color:#002A63;
	background:transparent;
	border:0;
}

#works_wrap .more:after{
	background-image:url(./img/arrow.svg);
}

#works_wrap .more:hover{
	color:#fff;
	background:#002A63;
}

#works_wrap .more:hover:after{
	background-image:url(./img/arrow_white.svg);
}



#service_wrap{
	margin:0 auto 1.5em;
	max-width:1500px;
}

#service_wrap h3{
	font-size:600%;
	color:transparent;
	-webkit-text-stroke: 1px rgba(0,42,99,.5);
	text-stroke: 1px rgba(0,42,99,.5);
	text-shadow:-5px -3px 0 rgba(0,42,99,.5);
}

#service_wrap > div{
	display:flex;
	flex-wrap:wrap;
}

#service_wrap > div:first-of-type{
	flex-wrap:nowrap;
	align-items:center;
}

#service_wrap > div:first-of-type > p{
	padding:1em 2em;
}

#service_wrap div div{
	margin:1%;
	padding:.5em;
	width:31.3333%;
	background-color: #002A63;
	overflow:hidden;

}

#service_wrap > div > div h4{
	padding:.5em .5em 0 50px;
	color:#fff;
	font-size:200%;
}


#service_wrap > div > div:before{
	display:block;
	position:absolute;
	content:'';
	margin:auto;
	width:50px;
	height:50px;
	background-color:#0078A5;
	top:0;
	bottom:0;
	left:-25px;
	transform: rotate(45deg);
}

#access_wrap{
	padding:2em 0 100px;
	//background-image:url(./img/contact_bg.jpg);
	background-image:url(/common/files/uploads/2020/06/IMG_E4846.jpg);
	background-attachment: fixed;
	background-size:cover;
	background-position:center;
}

@media all and (-ms-high-contrast: none) {
#access_wrap{
	background-attachment: inherit;
}

}

#contact_wrap {
	display:flex;
	justify-content:space-between;
	margin:-80px auto 1.5em;
	max-width:1000px;
}

#contact_wrap div{
	display:flex;
	padding:1em 2em;
	width:100%;
	flex-direction:column;
	background-color: #002A63;
}

#contact_wrap div p{
	color:#fff;
	font-size:120%;
}

#contact_wrap div h4{
	font-size:150%;
	color:#fff;
}
#contact_wrap div:first-of-type h4{
	margin-bottom:1em;
}

#contact_wrap .more{
	display:inline-block;
	margin:1.5em 0;
	padding:1em 5em;
	background-color:transparent;
	border:1px solid #fff;
	border-radius:0;
}

#contact_wrap .more:hover{
	color:#6480a7;
	background-color:#fff;
}

.youtube {
	position: relative;
	padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
	height: 0;
	overflow: hidden;
}

.youtube iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.red{
	color:#AE000D;
}

.more{
	padding:.3em 2.5em .3em 1em;
	color:#fff;
	font-weight:bold;
	text-decoration:none;
	border-radius:5px;
	background-color:#002A63;
	border:1px solid #002A63;
	transition:.2s;
}

.more:after{
	position:absolute;
	display:block;
	content:'';
	margin:auto;
	width: 25px;
	height: 100%;
	background-image:url(./img/arrow_white.svg);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	top:0;
	bottom:0;
	right:.5em;
	transition:.2s;
}

.more:hover{
	color:#002A63;
	background-color:#fff;
}

.more:hover:after{
	background-image:url(./img/arrow.svg);
}

.harfbox{
	display:flex;
	align-items:center;
}

.harfbox > *{
	width:100%;
	padding:1em;
}


.harfbox .right_large > *{
	width:70%;
}


.harfbox .right_large > :first-of-type{
	width:30%;
}

.triplebox{
	display:flex;
	flex-wrap:wrap;
	align-items:center;

}

.triplebox > *{
	width:calc(99.9999% /3);
	padding:1em;
}
.quortbox{
	display:flex;
	flex-wrap:wrap;
	align-items:center;

}

.quortbox > *{
	width:25%;
	padding:1em;
}

.textcenter{
	text-align:center;
}

.textright{
	text-align:right;
}

.top{
	display:flex;
	align-items:flex-start;
	-ms-align-items:flex-start;
}

.middle{
	display:flex;
	align-items:center;
}

.right{
	display:flex;
	justify-content:flex-end;
}


.left{
	display:flex;
	justify-content:flex-start;
}

.center{
	display:flex;
	justify-content:center;
}

.mincho{
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

/* page */
#page #main_image:before{
	display:none;
}

#main_image #page_title_bg{
	display:flex;
	min-height: 300px;
	background-image:url(./img/page_title_bg.jpg);
	background-size:cover;
	background-position:center bottom;
}

#main_image #page_title{
	position:absolute;
	display:flex;
	align-items:center;
	height:100%;
	top:0;
	left:0;
}

#main_image #page_title h2{
	margin: auto;
	padding-left:.5em;
	max-width: 1200px;
	font-size: 350%;
	color: transparent;
	//-webkit-text-stroke: 1px rgba(0,42,99,.3);
	//text-stroke: 1px rgba(0,42,99,.5);
	//text-shadow: -3px -3px 0 rgba(0,42,99,.7);
	color: #fff;
	text-shadow: 2px 2px 5px #aaa;
	text-align: right;
}

#header ul{
	background-color:rgba(255,255,255,.7);
}

#page #breadcrumb{
	margin: auto;
	padding:1em;
}

#page #breadcrumb ul{
	display:flex;
	font-size:90%;
	justify-content:flex-start;
	padding:0 1em;
}

#page #breadcrumb ul li{
	margin-left: .5em;
	padding-left: 0;
}

#page #breadcrumb ul li:after{
	margin-left: .5em;
	content: '＞';
}

#page #breadcrumb ul li:last-child:after{
	content:'';
}

#page #breadcrumb ul li:before{
	display:none;
}

#page #sns_bookmark{
	margin-bottom:1em;
	text-align:right;
}

#page #sns_bookmark *{
	vertical-align: middle;
}

#page #sns_bookmark > div{
	display:inline-block;
	line-height: 1;
}

#page .cont_frame{
	margin:0 auto 5em;
	padding:1em;
	max-width:1200px;
}

#page #main .cont_frame h3{
	clear:both;
	display:table;
	margin:2em auto 1em;
	padding-left:60px;
	color:#002A63;
	font-size:250%;
	background-image:url(./img/logo_icon-01.svg);
	background-repeat:no-repeat;
	background-size: auto 55px;
	background-position:left center;
}

#page #main .cont_frame > h3:first-of-type{
	margin-top:0;
}

#page #main .cont_frame h4{
	display: table;
	margin-bottom:1.5em;
	max-width:calc(100% - 150px);
	color:#002A63;
	font-size:180%;
}

#page #main .cont_frame h4:after{
	display:block;
	position:absolute;
	content:'';
	margin: auto;
	width:150px;
	height:3px;
	background-color:#008A32;
	top:0;
	bottom:0;
	right:-180px;
}

#page #main .cont_frame h5{
	margin-bottom:1.5em;
	padding:.5em .5em .5em 30px;
	color:#fff;
	font-size:120%;
	background-color:#002A63;
	border-radius:5px;
	overflow:hidden;
}

#page #main .cont_frame h5:before {
	display: block;
	position: absolute;
	content: '';
	margin: auto;
	width: 40px;
	height: 40px;
	background-color: #0078A5;
	top:0;
	bottom:0;
	left: -25px;
	transform: rotate(45deg);
}


#page #main .cont_frame h6{
	margin-bottom:1.5em;
	padding:.3em .5em .3em 30px;
	color:#002A63;
	font-size:100%;
	background-color:#cfedf8;
	border-radius:5px;
	overflow:hidden;
}

#page #main .cont_frame h6:before {
	display: block;
	position: absolute;
	content: '';
	margin: auto;
	width: 40px;
	height: 40px;
	background-color: #002A63;
	top:0;
	bottom:0;
	left: -25px;
	transform: rotate(45deg);
}

#page #main .cont_frame p{
	margin-bottom:1.5em;
}

#page #main .cont_frame > p{
	margin-left:auto;
	margin-right:auto;
	max-width:1000px;
}

#page #main .cont_frame img{
	box-shadow:2px 2px 5px #aaa;
}

#page #main .cont_frame img.noshadow{
	box-shadow:none;
}


#page #main .cont_frame blockquote{
	padding:1em;
	margin:0 auto 1.5em;
	max-width:1000px;
	border:3px solid #002A63;
	border-right:3px solid #008A32;
	border-radius:5px;
}

#page #main .cont_frame blockquote > :last-child{
	margin-bottom:0;
}

#page #main .cont_frame ul{
	margin-bottom:1.5em;
}

#page #main .cont_frame ul li{
	margin-left:1.5em;
	margin-bottom:.5em;
}

#page #main .cont_frame ul li:before {
	display: block;
	position: absolute;
	content: '';
	margin: auto;
	width: 1em;
	height: 1em;
	background-color: #0078a5;
	border-radius:5px;
	top:.25em;
	left: -1.5em;
}

#page #main .cont_frame ol{
	margin-bottom:1.5em;
}

#page #main .cont_frame ol li{
	margin-left:1.5em;
	counter-increment: olNum1;

}

#page #main .cont_frame ol li:before {
	display: block;
	position: absolute;
	content: '';
	margin: auto;
	width: 1em;
	height: 1em;
	background-color: #0078a5;
	border-radius:5px;
	top:.25em;
	left: -1.5em;
}

#page #main .cont_frame ol > li:after{
	position: absolute;
	display:flex;
	justify-content:center;
	align-items:center;
	width: 1em;
	height: 1em;
	border-radius: 25px;
	color: #fff;
	top: .25em;
	left: -1.5em;
	content: counter(olNum1);
}

#page #main .cont_frame table{
	margin-bottom:1.5em;
	border-top:1px solid #0078a5;
	border-left:1px solid #0078a5;	
}

#page #main .cont_frame table th{
	padding:.5em 2em;
	color:#fff;
	white-space: nowrap;
	background:#0078a5;
	border-right:1px solid #fff;	
	border-bottom:1px solid #fff;
}

#page #main .cont_frame table td{
	padding:.5em;
	border-right:1px solid #0078a5;	
	border-bottom:1px solid #0078a5;
}

#page #main .cont_frame table tr > :last-child{
	border-right:1px solid #0078a5;
}

#page #main .cont_frame table th > :last-child,
#page #main .cont_frame table td > :last-child{
	margin-bottom:0;
}

#page #main .cont_frame table.flex_table,
#page #main .cont_frame table.flex_table > tbody{
	display:block;
	max-width:100%;
	background:transparent;
	border-top: 0;
	border-left: 0;
	border:0;
}

#page #main .cont_frame table.flex_table > tbody > tr{
	display:flex;
}

#page #main .cont_frame table.flex_table > tbody > tr > td{
	display:block;
	padding:1em;
	width:auto !important;
	border-right: 0;
	border-bottom: 0;
}

#page #main .cont_frame table.flex_table > tbody > tr > td table.flex_table td{
	padding:.5em;
}

#page #main .cont_frame table.flex_table.aligncenter > tbody > tr > td{
	width:auto !important;
}

#page #main .cont_frame table.flex_table.alignright > tbody > tr{
	justify-content:flex-end;
}

#page #main .cont_frame table.flex_table.al_center > tbody > tr{
	align-items:center;
}

#page #main .cont_frame table.flex_table.eqwidth > tbody > tr > td{
	width:100% !important;
}

#page #main .cont_frame table.flex_table.aligncenter,
#page #main .cont_frame table.flex_table.aligncenter > tbody{
	display:table;
	margin:auto;
}

#page #main .cont_frame table.tb_noborder,
#page #main .cont_frame table.tb_noborder td{
	border:0;
}

#page #pagenate a{
	display:inline-block;
	margin:auto 1em;
}

/* form */
#page #main .cont_frame form table,
#page #main .cont_frame form table tr > :last-child{
	margin:0 auto;
	border:0;
}

#page #main .cont_frame form table td{
	vertical-align:top;
	padding:1em;
	border:0;
}

#page #main .cont_frame form td h6{
	padding:0;
	margin-top:.2em;
	background:none;
}

#page #main .cont_frame form h6:before{
	display:none;
}

#page #main form input,
#page #main form textarea{
	max-width:100%;
	padding:.2em 1em;
	font-size: 100%;
	border:1px solid #ccc;
	border-radius:5px;
	font-family: 游ゴシック,メイリオ,Meiryo,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,Osaka,ＭＳ\ Ｐゴシック,MS PGothic,sans-serif;

}

#page #main form select{
	padding:1em;
	padding:.2em 1em;
	font-size: 100%;
	border:1px solid #ccc;
	border-radius:5px;
	font-family: 游ゴシック,メイリオ,Meiryo,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,Osaka,ＭＳ\ Ｐゴシック,MS PGothic,sans-serif;
}

#page #main form input[type=submit],
#page #main form input[type=button],
#page #main form button[type=submit]{
	position:relative;
	display:block;
	margin:auto;
	color:#fff;
	font-weight:bold;
	letter-spacing:0.5em;
	text-shadow:none;
	background: #052f47;
	cursor:pointer;
	transition:.2s;
	font-family: 游ゴシック,メイリオ,Meiryo,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,Osaka,ＭＳ\ Ｐゴシック,MS PGothic,sans-serif;
}

#page table#mfp_confirm_table tr th,
#page table#mfp_confirm_table tr td{
	padding:1em .5em;
	font-size:100%;
}

#page .mfp_element_submit,
#page .mfp_element_reset,
#page .mfp_element_button,
#page button.mfp_next,
#page button.mfp_prev{
	position:relative;
	margin:auto;
	color:#fff;
	font-weight:bold;
	letter-spacing:0.05em;
	text-shadow:none;
	background: #052f47;
	cursor:pointer;
	transition:.2s;
	font-family: 游ゴシック,メイリオ,Meiryo,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,Osaka,ＭＳ\ Ｐゴシック,MS PGothic,sans-serif;
}


#page #main form input[type=submit]:hover,
#page #main form input[type=button]:hover,
#page #main form button[type=submit]:hover{
	background-color:#718692;
	transition:.2s;
}

#page #main form input[type=submit]:before {
    display: block;
    position: absolute;
    content: '';
    margin: auto;
    width: 1em;
    height: .5em;
    background: linear-gradient(to top left, rgba(255,255,255,0) 50%, #052F47 50.5%) no-repeat top left/100% 100%;
    top: .5em;
    left: -1.2em;
}

#page #main form input[type=reset]{
	position:relative;
	display:inline-block;
	margin:auto;
	padding:.5em 1em;
	width:auto;
	color:#fff;
	font-size:100%;
	letter-spacing:.8em;
	background-color:#666;
	text-align:center;
	cursor:pointer;
	transition:.2s;
}

#page #main form input[type=reset]:hover{
	background-color:#aaa;
	transition:.2s;
}

#page #main .cont_frame iframe{
	width:100%;
}



/* footer */

#footer_wrap{
	background-color:#fff;
}

#footer_wrap .harfbox{
	width:auto;
	justify-content:space-between;
}

#footer_wrap .harfbox > *{
	width:auto;
}

#footer_wrap ul{
	display:flex;
	justify-content:center;
}

#footer_wrap ul li:before{
	content:'◆';
}

#footer_wrap ul li a{
	margin:0 2em 0 0;
	color:#002A63;
}

#footer_wrap ul li a:hover{
	text-decoration:none;
}

#footer_wrap div:nth-child(2) p{
	padding:1em;
}

#copyright{
	color:#002A63;
	font-size:90%;
	text-align:center;
}

/* 画面外にいる状態 */
.animate {
	opacity : 0;
	transform : translate(0, 50px);
	transition : all 700ms;
}

/* 画面内に入った状態 */
.animate.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}

.animate.delay2{
	-moz-transition-delay:200ms;
	-webkit-transition-delay:200ms;
	-o-transition-delay:200ms;
	-ms-transition-delay:200ms;
}

.animate.delay4{
	-moz-transition-delay:400ms;
	-webkit-transition-delay:400ms;
	-o-transition-delay:400ms;
	-ms-transition-delay:400ms;
}

.animate.delay6{
	-moz-transition-delay:600ms;
	-webkit-transition-delay:600ms;
	-o-transition-delay:600ms;
	-ms-transition-delay:600ms;
}

.animate.delay8{
	-moz-transition-delay:800ms;
	-webkit-transition-delay:800ms;
	-o-transition-delay:800ms;
	-ms-transition-delay:800ms;
}

#sp_toggle,
#header ul li.sp_menu_close{
	display:none;
}

/* pagetop */
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 10px;
  bottom: 100px;
  background:#008A32;
  opacity: 0;
  transition:.2s;
  z-index:999;
transform: rotate(45deg);
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
transform: rotate(-45deg);
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '↑';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  line-height:1;
  top: -5px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

#sp_toggle{
	display:none;
}

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

img{
	max-width:100%;
	height:auto;
}

#header_wrap{
	position:relative;
}

#about_wrap,
#recruit_wrap .cont_frame,
#main_image_wrap,
#contact_wrap{
	flex-direction:column;
}

#main_image_wrap > div,
#about_wrap div:first-of-type,
#about_wrap div,
#recruit_wrap .cont_frame div:first-of-type{
	width:100%;
	max-width:100%;
}

#main_image_wrap > div:first-of-type p{
	display:none;
}

}

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

.alignright{
	float:none;
	clear: both;
	display: block;
	margin-left: auto !important;
	margin-right: auto !important;
}

.alignleft{
	float:none;
	clear: both;
	display: block;
	margin-left: auto !important;
	margin-right: auto !important;
}

.alignright{
	float:none;
	clear: both;
	display: block;
	margin-left: auto !important;
	margin-right: auto !important;
}

table.aligncenter{
	margin:0 !important;
}

img.size-medium{
	display:block;
	margin:0 auto;
}


#sp_toggle{
	position:relative;
	display:table;
	margin: 0 0 0 auto;
	padding:1.5em;
	font-size:100%;
	color:#002a63;
	text-align:center;
	font-weight:bold;
	box-sizing:border-box;
	cursor:pointer;
}

#sp_toggle #sp_toggle_icon{
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 2px;
  margin: -1px 0 0 -2.5em;
  background: #002a63;
  transition: .2s;
}

#sp_toggle #sp_toggle_icon:before,
#sp_toggle #sp_toggle_icon:after{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 14px;
  height: 2px;
  background: #002a63;
  transition: .3s;
}

#sp_toggle #sp_toggle_icon:before{
  margin-top: -6px;
}

#sp_toggle #sp_toggle_icon:after{
  margin-top: 4px;
}

#sp_toggle #sp_toggle_icon.close{
  background: transparent;
}

#sp_toggle #sp_toggle_icon.close:before, #panel-btn .close:after{
  margin-top: 0;
}

#sp_toggle #sp_toggle_icon.close:before{
  margin-top: -1px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

#sp_toggle #sp_toggle_icon.close:after{
  margin-top: -1px;
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

#header_wrap{
	position:fixed;
	background-color: rgba(255,255,255,.7);
}

#header_wrap.menuopen{
	overflow:hidden;
	background-color: rgba(255,255,255,1);
	transition:.2s;
}

#header_wrap.menuopen #header{
	display:block;
}

#header ul{
	display:none;
}

#header ul li{
	margin:0;
}

#header ul li a:before{
	display:none;
}

#header ul li a{
	padding:1em;
}

#works_wrap div div{
	width:48%;
}

#page #main .cont_frame table.flex_table > tbody > tr{
	flex-direction:column;
}

#page #main .cont_frame table.flex_table > tbody > tr > td{
	padding:0;
}

#page #main .cont_frame table.flex_table > tbody > tr > td > :last-child{
	margin-bottom:1.5em;
}

form table,
form table tbody,
form table tr,
form table th,
form table td{
	display:block;
	width:100%;
}

}

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

#main_image_wrap h1 a{
	margin:.5em;
	width: 160px;
	height: 50px;
}

#sp_toggle{
	padding:1em 1.5em;
	height:50px;
}

#header ul{
	background:transparent;
}

#news_wrap ul{
	width:100%;
}

#news_wrap ul li{
	flex-direction:column;
}

#news_wrap ul li .date{
	padding-bottom:0;
}

#about_wrap div{
	padding:1em;
}

#about_wrap h3,
#recruit_wrap h3,
#works_wrap h3{
	font-size:400%;
}

#about_wrap h4{
	font-size:200%;
	margin-bottom:1.5rem;
}

#recruit_wrap .cont_frame > div:first-of-type p{
	margin-bottom:2em;
}

#works_wrap div div{
	width: 98%;
	margin-bottom:1.5rem;
}

#contact_wrap .more{
	padding: .3em 2.5em .3em 1em;
}

#access_wrap iframe{
	height:300px
}

#footer_wrap ul{
	padding-left:1em;
	flex-direction:column;
}

#footer_wrap ul li{
	margin-bottom:1.5rem;
}

#page #main {
	display:flex;
	flex-direction:column;
}

#page #breadcrumb{
	display:none;
	order:2;
}

#page #cont{
	order:1;
}

#page #sns_bookmark{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	padding:1em 0;
	order:3;
}

#page #sns_bookmark > div{
	margin:.5em;
}

#page form{
	order:2;
}

#page .cont_frame{
	margin-bottom:3em;
}

#main_image #page_title h2{
	font-size:200%;
}

#page #main .cont_frame h3{
	padding-left: 40px;
	font-size:150%;
	background-size: auto 35px;
}

#page #main .cont_frame h4{
	max-width:100%;
	font-size:150%;
	overflow:hidden;
}

#page #main .cont_frame h4:after{
	width:100%;
	top:auto;
	right:0;
}


#page #main .cont_frame table,
#page #main .cont_frame table tbody,
#page #main .cont_frame table tr,
#page #main .cont_frame table th,
#page #main .cont_frame table td{
	display:block;
	padding:.5em 0;
	width:100%;
}

#page #main form input,
#page #main form textarea{
	width:100% !important;
}

}