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

@media screen and (min-width:769px){

.wrapper{
	width:1000px;
	margin:0 auto;
	position:relative;
}


/* main_image */

.main_image_area{
	padding:150px 0 265px 0;
	position:relative;
	background-image:url(../images/main_image.jpg);
	background-repeat:no-repeat;
	background-position:center top;
	background-size:cover;
	text-align:center;
}
.main_image_area:after{
	content:"";
	width:100%;
	height:100%;
	background:url(../images/cover.png) repeat;
	background-position:center;
	background-size:auto auto;
	position:absolute; top:0; left:0;
	z-index:10;
}
.main_image_area h1.logo{
	width:300px;
	margin:0 auto;
	position:relative;
	z-index:20;
	transition:.3s;
	transform:scale(0, 0);
	-webkit-transform:scale(0, 0);
}
.main_image_area .logo.on{
	transform:scale(1, 1);
	-webkit-transform:scale(1, 1);
}
.main_image_area .title{
	padding-top:60px;
	position:relative;
	z-index:20;
	font-size:20px;
	transition:.3s;
	transform:scale(0, 0);
	-webkit-transform:scale(0, 0);
}
.main_image_area .title.on{
	transform:scale(1, 1);
	-webkit-transform:scale(1, 1);
}
.main_image_area nav{
	padding-top:57px;
	position:relative;
	z-index:20;
	font-size:0;
}
.main_image_area nav .item{
	width:auto;
	margin-top:0;
	padding:0 30px;
	display:inline-block;
	vertical-align:top;
	transition:.3s;
	transform:scale(0, 0);
	-webkit-transform:scale(0, 0);
}
.main_image_area nav .item:nth-child(1){
	transition-delay:0;
}
.main_image_area nav .item:nth-child(2){
	transition-delay:.25s;
}
.main_image_area nav .item:nth-child(3){
	transition-delay:.5s;
}
.main_image_area nav .item:nth-child(4){
	transition-delay:.75s;
}
.main_image_area nav .item:nth-child(5){
	transition-delay:1s;
}
.main_image_area nav .item.on{
	transform:scale(1, 1);
	-webkit-transform:scale(1, 1);
}
.main_image_area nav .item a{
	display:block;
	text-decoration:none;
}
.main_image_area nav .item a .icon{
	display:block;
	transition:all 0.2s ease-in 0s;
}
.main_image_area nav .item a:hover .icon{
	filter:brightness(125%);
}
.main_image_area nav .item a .icon img{
	width:88px;
}
.main_image_area nav .item a .text{
	padding-top:20px;
	border-bottom:1px solid transparent;
	display:inline-block;
	position:relative;
	font-family:"Raleway", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:18px;
	font-weight:500;
}
.main_image_area nav .item a .text:before,
.main_image_area nav .item a .text:after{
	content:"";
	width:0;
	height:1px;
	background:#333;
	position:absolute; top:48px;
	transition: all 0.15s ease-in 0s;
}
.main_image_area nav .item a .text:before{
	left:50%;
}
.main_image_area nav .item a .text:after{
	right:50%;
}
.main_image_area nav .item a:hover .text:before,
.main_image_area nav .item a:hover .text:after{
	width:50%;
}
.main_image_area nav .item a.on .text:before,
.main_image_area nav .item a.on .text:after{
	width:50%;
}


/* menu */

header .menu{
	margin-left:115px;
	display:inline-block;
	vertical-align:middle;
}
header .menu .box{
	width:auto;
	height:auto;
	background:none;
	position:static;
	z-index:90;
	text-align:left;
	pointer-events:auto;
	overflow:visible;
}
header .menu nav{
	padding:0;
	font-size:0;
}
header .menu div{
	padding:0 35px 0 0;
	border-bottom:none;
	display:inline-block;
	vertical-align:middle;
	text-align:left;
}
header .menu nav div:last-child{
	padding-right:0;
}
header .menu div a{
	padding:0;
	display:inline;
	position:relative;
	font-family:"Raleway", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:17px;
	color:#333;
	font-weight:500;
	text-decoration:none;
}
header .menu div a:before,
header .menu div a:after{
	content:"";
	width:0;
	height:1px;
	background:#333;
	position:absolute; top:25px;
	transition: all 0.15s ease-in 0s;
}
header .menu div a:before{
	left:50%;
}
header .menu div a:after{
	right:50%;
}
header .menu div a:hover:before,
header .menu div a:hover:after{
	width:50%;
}
header .menu div a.on:before,
header .menu div a.on:after{
	width:50%;
}


/* header */

header{
	width:100%;
	background:rgba(255,255,255,0.95);
	position:fixed; top:0; left:0;
	z-index:50;
}
.head{
	width:1000px;
	margin:0 auto;
	padding:20px 15px;
	font-size:0;
	text-align:left;
}
.head h1.logo{
	width:298px;
	display:inline-block;
	vertical-align:middle;
}


/* main_contents*/

.main_contents{
	border-bottom:1px solid #DDD;
}

.h2_area{
}
.h2_area > div{
	height:300px;
	background-repeat:no-repeat;
	background-position:center top;
	background-size:cover;
	position:relative;
}
body.service_page .h2_area > div{
	background-image:url(../images/service/bg.jpg);
}
body.detail_page .h2_area > div{
	background-image:url(../images/service_detail/bg.jpg);
}
body.company_page .h2_area > div{
	background-image:url(../images/company/bg.jpg);
}
body.recruit_page .h2_area > div{
	background-image:url(../images/recruit/bg.jpg);
}
body.contact_page .h2_area > div{
	background-image:url(../images/contact/bg.jpg);
}
.h2_area:after{
	content:"";
	width:100%;
	height:110px;
	background:url(../images/stripe.jpg) repeat;
	display:block;
}
.h2_area .inner{
	width:250px;
	height:250px;
	padding:10px;
	background:#FFF;
	border-radius:100%;
	position:absolute; top:140px; left:20px;
	text-align:center;
}
.h2_area .icon{
	width:auto;
	display:inline-block;
	vertical-align:top;
}
.h2_area h2{
	font-family:"Raleway", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:30px;
	font-weight:500;
}
.h2_area .text{
	font-size:14px;
}

.container{
}

.service{
	padding:15px 20px 90px 20px;
	font-size:0;
	text-align:center;
}
.service .item{
	width:300px;
	margin:30px 30px 0 0;
	display:inline-block;
	vertical-align:top;
	position:relative;
}
.service .item:nth-child(2n){
	margin-left:0;
}
.service .item:nth-child(3n){
	margin-right:0;
}
.service .item:after{
	content:"";
	border-top:10px solid transparent;
	border-right:10px solid #F7D610;
	border-bottom:10px solid #F7D610;
	border-left:10px solid transparent;
	position:absolute; bottom:0; right:0;
	z-index:10;
}
.service .item a{
	height:220px;
	padding:40px 10px 10px 10px;
	border:1px solid #DDD;
	display:block;
	position:relative;
	text-decoration:none;
	transition:all .2s;
}
.service .item a::before,
.service .item a::after{
	content:"";
	width:0;
	height:0;
	border:1px solid transparent;
	position:absolute;
	z-index:2;
}
.service .item a::before{
	bottom:-1px; right:-1px;
}
.service .item a::after{
	top:-1px; left:-1px;
}
.service .item a:hover::before,
.service .item a:hover::after{
	width:100%;
	height:100%;
}
.service .item a:hover::before{
	border-bottom-color:#F7D610;
	border-left-color:#F7D610;
	transition:width .2s, height .2s .2s;
}
.service .item a:hover::after{
	border-top-color:#F7D610;
	border-right-color:#F7D610;
	transition:width .2s .4s, height .2s .6s;
}
.service .icon{
	width:auto;
	display:inline-block;
	vertical-align:top;
}
.service .text{
	padding-top:25px;
	font-size:18px;
	display:block;
}

.service_detail{
	padding-top:20px;
}
.service_detail .item{
	margin-top:-100px;
	padding-top:150px;
}
.service_detail h3{
	padding:0 25px 5px 25px;
	border-bottom:3px solid #FEEE39;
	font-size:20px;
	font-weight:bold;
}
.service_detail .inner{
	font-size:0;
}
.service_detail .detail{
	padding-top:30px;
}
.service_detail .inner.double .detail{
	width:490px;
	display:inline-block;
	vertical-align:top;
}
.service_detail .inner.double .detail:last-child{
	margin-left:20px;
}
.service_detail .thum{
	width:50%;
	margin:0 auto;
	text-align:center;
}
.service_detail .inner.double .detail .thum{
	width:auto;
	margin:0;
}
.service_detail .text{
	padding:15px 10px 0 10px;
	font-size:15px;
	text-align:center;
}
.service_detail .inner.double .detail .text{
	text-align:left;
}

.site{
	margin-top:30px;
	padding-bottom:85px;
	border-top:1px dashed #CCC;
}
.site .item{
	padding:30px 0 25px 0;
	border-bottom:1px dashed #CCC;
}
.site .thum{
	width:300px;
	margin:0;
	float:left;
	text-align:center;
}
.site .inner{
	width:665px;
	padding-top:15px;
	float:right;
}
.site .title{
	font-size:22px;
	font-weight:bold;
}
.site .link{
	padding-top:10px;
	font-size:16px;
}
.site .link a{
	color:#0064C6;
}
.site .text{
	padding-top:20px;
	font-size:15px;
}
.site .caution{
	padding-top:30px;
	font-size:16px;
	text-align:right;
}

.company{
}
.company .table_box{
	padding-top:55px;
}
.company .map{
	height:0;
	margin-top:15px;
	padding:285px 0 0 0;
	position:relative;
	overflow:hidden;
}
.company .map iframe{
	width:100%;
	height:100%;
	position:absolute; top:0; left:0;
}

.company .movie{
	text-align: center;
}

.company .movie video{
	width: 70%;
	height: auto;
}

.greeting{
	margin:50px 0 55px 0;
	padding:30px 30px 35px 30px;
	border:1px solid #DDD;
	border-radius:15px;
}
.greeting .title{
	padding:0 15px;
	font-size:25px;
	font-weight:bold;
	letter-spacing:5px;
}
.greeting .text{
	padding-top:20px;
	font-size:18px;
}
.greeting .name{
	padding-top:20px;
	text-align:right;
}
.greeting .name img{
	width:auto;
}

.recruit{
	padding-top:55px;
}
.recruit .table_box{
}
.recruit .type{
	margin-top:-5px;
	padding:0 5px;
	font-size:0;
}
.recruit .type .item{
	margin:5px 5px 0 0;
	padding:5px 10px;
	background:#FEDC71;
	border-radius:4px;
	display:inline-block;
	vertical-align:top;
	font-size:13px;
}
.recruit .category{
	margin-top:-5px;
	padding:0 5px;
	font-size:0;
}
.recruit .category .item{
	margin:5px 5px 0 0;
	padding:4px 9px;
	border:1px solid #DDD;
	border-radius:4px;
	display:inline-block;
	vertical-align:top;
	font-size:13px;
}

.recruit .pdf{
	padding-top: 10px;
}
	
.recruit .pdf a{
	color:red;
	font-weight: bold;
	padding-top: 10px;
}
	
.recruit_banner{
	padding-top:30px;
	font-size:0;
}
.recruit_banner .item{
	width:192px;
	margin:0 10px 10px 0;
	display:inline-block;
	vertical-align:top;
}
.recruit_banner .item:nth-child(2n){
	margin-right:10px;
}
.recruit_banner .item:last-child{
	margin-right:0;
}

.contact.recruit_form{
	padding-top:55px;
}
.recruit_form h3{
	padding:0 10px 10px 10px;
	border-bottom:1px solid #DDD;
	font-size:25px;
	line-height:36px;
	font-weight:bold;
}
.recruit_form h3:before{
	content:"\f2b6";
	margin-right:15px;
	font-family:"Font Awesome 5 Pro";
	font-size:36px;
	line-height:36px;
	color:#AAA;
	font-weight:300;
}
.recruit_form .table_box{
	padding-top:30px;
}
.recruit_form .table_box td.title{
	width:170px;
	text-align:center;
}
.contact.recruit_form .form_btn button{
	background:#3B82C4;
}
.contact.recruit_form .form_btn button.prev{
	background:#AAA;
}

.contact{
	padding:55px 0 90px 0;
}
.contact .table_box{
}
.contact .table_box th.required:after{
	content:"※";
	color:#E64C3B;
}
.contact .table_box td{
	padding:10px;
}
.contact .table_box td div{
	padding:0;
}
.form_btn{
	margin-top:55px;
	font-size:0;
	text-align:center;
}
.form_btn button{
	width:350px;
	margin:0 20px;
	padding:20px;
	display:inline-block;
	background:#2EAB8A;
	border:none;
	border-radius:10px;
	outline:none;
	vertical-align:baseline;
	font-size:20px;
	color:#FFF;
	font-weight:normal;
	cursor:pointer;
}
.form_btn button.prev{
	margin-top:0;
	background:#AAA;
}


/* thanks */

.thanks{
	padding:55px 0;
	font-size:18px;
	text-align:center;
}


/* footer */

footer{
}
footer .copyright{
	padding:30px 0;
	font-size:14px;
	text-align:center;
}

}