@charset "UTF-8";
.f_f1{
	font-family: 'Shippori Mincho B1', serif;

}
.f_f2{
	font-family: 'Lobster', cursive;

}
.f_f3{
	font-family: 'Crimson Pro', serif;

}
.f_f4{
	font-family: 'Racing Sans One', cursive;

}
.f_f5{
	font-family: 'Smokum', cursive;

}
.f_f6{
	font-family: 'DM Sans', sans-serif;

}
.f_f7{
	font-family: 'Comfortaa', cursive;

}
.f_f8{
	font-family: 'Abril Fatface', cursive;

}
.f_f9{
	font-family: 'Bruno Ace SC', cursive;

}
.f_f10{
	font-family: 'Trochut', cursive;
}
.f_f11{
	font-family: 'Kosugi Maru', sans-serif;
}
.shadow-bold{
	text-shadow: 0.3px 0.3px 0, 0.3px -0.3px 0px, -0.3px 0.3px 0, -0.3px -0.3px 0px, 0.3px 0px 0px, 0px 0.3px 0px, -0.3px 0px 0px, 0px -0.3px 0px;
	letter-spacing: 1px;
}


#slideshow {
	position: relative;
	width: 100%;
	height:42vw;
	margin:0 auto;
}
#slideshow p {
	position: absolute;
	top:  0;
	left: 0;
	z-index: 8;
	opacity: 0.0;
	background-color: white;
	margin: 0;
	height:42vw;
}
#slideshow p.active {
	z-index: 10;
	opacity: 1.0;
}
#slideshow p span{
	font-weight: bold;
	font-size:4vw;
	position: relative;
	left:3%;
	bottom:95%;
	color:#27689b;
	text-shadow:1px 1px 0 #1eaaff, 3px 3px 0 #fff;
}
/*Safariだけに適用される新型CSSハック*/
_::-webkit-full-page-media, _:future, :root #slideshow p span {
	font-weight: bold;
	font-size:4vw;
	position: relative;
	left:3%;
	bottom:95%;
	color:#27689b;
	text-shadow:1px 1px 0 #1eaaff, 3px 3px 0 #fff;
}
#slideshow p span.subM{
	background:rgba(15,15,15,0.4);
	padding:5px 20px;
	position: relative;
	display:block;
	width:55%;
	font-size:2.2vw;
	margin:30px 0 0;
	color:#fff;
	text-shadow:none;
	line-height:1.5;
	letter-spacing: 1px;
}
/*Safariだけに適用される新型CSSハック*/
_::-webkit-full-page-media, _:future, :root #slideshow p span.subM{
	background:rgba(15,15,15,0.4);
	padding:5px 20px;
	position: relative;
	display:block;
	width:55%;
	font-size:2.2vw;
	margin:30px 0 0;
	color:#fff;
	text-shadow:none;
	line-height:1.5;
	letter-spacing: 1px;
}


#slideshow p img {
	width: 100%;
	height: 42vw;
	display: block;
	border: 0;
	margin-bottom: 10px;
}
	@media screen and (max-width: 767px) {	
		#slideshow {
			padding: 0px 0px;
			width: 100%;
			height: 70vh;
		}
		#slideshow p span{
			font-size:8vw;
			position: relative;
			left:3%;
			bottom:70vh;
			text-shadow:none;
		}
		#slideshow p span.subM{
			width:85%;
			display:block;
			font-size:4vw;
			margin:10px 0;
		}
		#slideshow p img {
			width: 100%;
			height: 70vh;
			display: block;
			border: 0;
			object-fit: cover;
		}
		_::-webkit-full-page-media, _:future, :root #slideshow p span {
			left:3%;
			bottom:70vh;
		}
	}
	

/*--------------------------------------------------------
	DIV sec01 
---------------------------------------------------------*/
/* text-shadow */
.shw{
text-shadow:1px 1px 0 #fff, 3px 3px 0 #000;
}
.shw-box{
box-shadow: 5px 5px 5px #c0c0c0;
}
.vertical {
	animation: vertical 6s linear infinite;
}
@keyframes vertical {
	0% {
		background-position: 0 0;
	}
	100% {
		background-position: 0 1080px;
	}
}

div.sec01,
div.sec02 {
	margin:0 auto;
	padding:10px 0 0;
	width:100%;
	height:auto;
	display:block;
	/*background:#ffff00;*/
	overflow:hidden;
	/*border-bottom:4px solid #151515;*/
}
div.sec01 h2,
div.sec02 h2 {
	font-size:3vw;
	width:100%;
	padding:30px 0;
	margin:0;
	text-align:center;
	color:#151515;
	font-weight:bold;
	border-bottom:#000 solid 4px;
	line-height:5vw;
}
div.sec01 h2 span{
	display:block;
	font-size:1vw;
}
div.sec01 .sec_box{
	width:80%;
	height:auto;
	margin:0 auto;
	padding:20px 0 10px;
	overflow:hidden;
}
div.sec01 .sec_box .left-boxs{
	width:48%;
	float:left;
	height:auto;
	padding:0 1%;
}
div.sec01 .sec_box .right-boxs{
	width:48%;
	float:left;
	height:auto;
	padding:0 1%;
	display:block;
}
div.sec01 .sec_box .right-boxs h3{
	font-size:2vw;
	font-weight:bold;
	line-height:1.2;
	color:#1eaaff;
}
div.sec01 .sec_box .right-boxs p{
	font-size:1.2vw;
	padding:30px 0 10px;
	line-height:1.5;
}
div.sec02 .box {
	width:100%;
	height:810px;
	margin-top:30px;
	background: linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .3)), url(../img/top/bg-index3.jpg) no-repeat;
	background-size: cover;
	position:relative;
	z-index:10;
}
/*
div.sec02 .box::before{
	content:"";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .3));
	
}
*/
div.sec02 .box .inner{
	width:70%;
	height:auto;
	margin:0 auto;
	padding:20px 0 0;
	line-height:1.5;
}
div.sec02 .box .inner h3{
	margin-top:30%;
	font-size:2vw;
	font-weight:bold;
	color:#fff;
	z-index:100;
}
	@media screen and (max-width: 767px) {	
		div.sec01{
			margin:0 auto;
			width:100%;
		}
		div.sec01 h2{
			font-size:6vw;
			font-weight:bolder;
			padding:20px 0;
			line-height:8vw;
			/*text-shadow:1px 1px 0 #fff, 2px 2px 0 #000;*/
		}
		div.sec02 h2{
			font-size:6vw;
			font-weight:bolder;
			padding:20px 0;
			line-height:8vw;
			/*text-shadow:1px 1px 0 #fff, 2px 2px 0 #000;*/
		}
		div.sec01 .sec_box{
			width:100%;
		}
		div.sec01 .sec_box .left-boxs{
			width:94%;
			float:none;
			background:#fff;
			height:auto;
			padding:0 2%;
		}
		div.sec01 .sec_box .right-boxs{
			width:94%;
			float:none;
			/*height:50vh;*/
			padding:0 2%;
		}
		div.sec01 .sec_box .right-boxs h3{
			font-size:6vw;
			padding:10px 5px;
		}
		div.sec01 .sec_box .right-boxs p{
			font-size:4vw;
			padding:10px 5px 0;
			line-height:1.8;
		}
		div.sec02 .box .inner h3{
			margin-top:40%;
			font-size:6vw;
		}

	}

/*--------------------------------------------------------
	DIV sec009 form
---------------------------------------------------------*/
#top #container .sec0010{
	background: linear-gradient(180deg, transparent 0 30%, #f5f5f5 70% 100%), url(../img/top/h2.jpg) no-repeat;
	background:cover;
	height:auto;
	position:relative;
}
#top #container .sec0011{
	background: linear-gradient(180deg, transparent 0 30%, #f5f5f5 70% 100%), url(../img/top/h22.jpg) no-repeat;
	background:cover;
	height:auto;
	position:relative;
}

#top #container .sec0010 .b_cover,
#top #container .sec0011 .b_cover{
	width:85%;
	position:relative;
	top:150px;
	left:50%;
	transform:translate(-50%, -50%);
	background:rgba(15,15,15,0.4);
	padding:30px 0;
}
#top #container .sec0010 .b_cover h2.style001,
#top #container .sec0011 .b_cover h2.style001{
	text-align: center;
	position: relative;
	font-size: 3vw;
	font-weight: 700;
	margin-bottom: 20px;
	color: #fff;
}
#top #container .sec0010 .b_cover h2.style001 span,
#top #container .sec0011 .b_cover h2.style001 span{
	font-size: 1.5vw;
	display: block;
	font-weight: normal;
	margin: 15px 0;
	color: #fff;
}
#top #container .sec0010 .b_cover h2.style001::after,
#top #container .sec0011 .b_cover h2.style001::after{
	content:"";
	width:80%;
	height:2px;
	display:inline-block;
	position:absolute;
	background-color:#fff;
	bottom: -10px;
	left: calc(50% - 40%)
}
	@media screen and (max-width: 767px) {
		#top #container .sec0010 .b_cover,
		#top #container .sec0011 .b_cover{
			width:80%;
			top:70px;
			padding:10px 0;
		}
		#top #container .sec0010 .b_cover h2.style001,
		#top #container .sec0011 .b_cover h2.style001{
			font-size: 5vw;
			font-weight: 700;
			margin-bottom: 10px;
			color: #fff;
		}
		#top #container .sec0010 .b_cover h2.style001 span,
		#top #container .sec0011 .b_cover h2.style001 span{
			font-size: 3vw;
		}
	}

#top #container .sec0010 .f_txt,
#top #container .sec0011 .f_txt{
	text-align:center;
	color:#fff;
	padding:10px 0;
	font-size:1.2vw;
	font-weight:500;
}
#top #container .sec0010 .inner,
#top #container .sec0011 .inner{
	width:100%;
	margin-top:50px;
}

	@media screen and (max-width: 767px) {
		#top #container .sec0010 .inner,
		#top #container .sec0011 .inner{
			margin-top:20px;
		}
		#top #container .sec0010 .f_txt,
		#top #container .sec0011 .f_txt{
			font-size:2.5vw;
		}
	}

#top #container .sec0010 .inner .form,
#top #container .sec0011 .inner .form {
	width:100%;
}
#top #container .sec0010 .inner .form .f_info,
#top #container .sec0011 .inner .form .f_info{
	width:80%;
	margin:0 auto;
	padding:20px 0;
}
	@media screen and (max-width: 767px) {
		#top #container .sec0010 .inner .form,
		#top #container .sec0011 .inner .form {
			width:100%;
		}
		#top #container .sec0010 .inner .form .f_info,
		#top #container .sec0011 .inner .form .f_info{
			width:100%;
			margin:0 auto;
			padding:0;
		}
	}
#top #container .sec0010 .inner .form .f_info .cmxform,
#top #container .sec0011 .inner .form .f_info .cmxform{
	margin:0 auto;
	padding:20px 10px;
	font-size:1vw;
	color:#000;
	font-weight:500;
}
#top #container .sec0010 .inner .form .f_info .cmxform p.tyu,
#top #container .sec0011 .inner .form .f_info .cmxform p.tyu{
	font-size:1vw;
	padding:5px 0 0;
}
#top #container .sec0010 .inner .form .f_info .cmxform p.tyu2,
#top #container .sec0011 .inner .form .f_info .cmxform p.tyu2{
	border-bottom:2px solid #000;
	padding-bottom:5px;
}
#top #container .sec0010 .inner .form .f_info .cmxform p.tyu em,
#top #container .sec0011 .inner .form .f_info .cmxform p.tyu em{
	color:#fff;
	background:#ff0000;
	font-weight:normal;
	font-style:normal;
	font-size:0.7vw;
	padding:2px 5px;
	vertical-align:middle;
	margin:0 5px 5px;
	border-radius:4px;
}
#top #container .sec0010 .inner .form .f_info .cmxform fieldset,
#top #container .sec0011 .inner .form .f_info .cmxform fieldset {
	margin:10px 0;
}
#top #container .sec0010 .inner .form .f_info .cmxform legend,
#top #container .sec0011 .inner .form .f_info .cmxform legend{
	font-weight:700;
	margin:5px 0 10px;
}
	@media screen and (max-width: 767px) {
		#top #container .sec0010 .inner .form .f_info .cmxform p.tyu,
		#top #container .sec0011 .inner .form .f_info .cmxform p.tyu{
			font-size:3.5vw;
		}
		#top #container .sec0010 .inner .form .f_info .cmxform p.tyu2,
		#top #container .sec0011 .inner .form .f_info .cmxform p.tyu2{
			font-size:2.8vw;
		}
		#top #container .sec0010 .inner .form .f_info .cmxform legend,
		#top #container .sec0011 .inner .form .f_info .cmxform legend{
			font-size:4vw;
		}
		#top #container .sec0010 .inner .form .f_info .cmxform p.tyu em,
		#top #container .sec0011 .inner .form .f_info .cmxform p.tyu em{
			font-size:1.8vw;
		}
	}
#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol,
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol{
	margin:0;
	padding:0;
}
#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li,
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li{
	list-style:none;
	margin:2px 0;
	padding:0px 0;
	width:100%;
}
#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li label,
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li label{
	display:inline-block;
	width:35%;
	padding: 0.5em 0.3em;
	margin:2px;
	background:#f1f1f1;
	font-size:1vw;
}
	@media screen and (max-width: 767px) {
		#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li,
		#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li{
			margin-bottom:8px;
		}
		#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li label,
		#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li label{
			display:block;
			width:97%;
			font-size:3.8vw;
		}

	}
#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li.relabel fieldset label{
	background:none;
	padding:10px;
}
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li.relabel fieldset label{
	width:94%;
	padding:20px 10px;
}

#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li.relabel3 label{
	width:35%;
	vertical-align:top;
}
#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li label em,
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li label em{
	color:#fff;
	background:#ff0000;
	font-weight:normal;
	font-style:normal;
	font-size:0.7vw;
	padding:2px 5px;
	vertical-align:middle;
	margin:0 5px;
	border-radius:4px;
	float:right;
}
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li.relabel fieldset label em{
	float:left;
	margin-right:10px;
}
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol .pri_to{
	padding:5px 10px;
}
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol .pri_to a{
	background:#27689b;
	color:#fff;
}
#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li input[type='text'],
#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li input[type='tel'],
#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li input[type='email'],
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li input[type='text'],
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li input[type='tel'],
#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li input[type='email']{
	font: 16px/24px sans-serif;
	box-sizing: border-box;
	width: 60%;
	padding: 0.3em;
	padding-left: 10px;
	letter-spacing: 0.5px;
	border: 0;
	background:#fefefe;
	float:clear;
}
input::placeholder, textarea::placeholder{
	color:#d3d3d3;
}
#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li textarea{
	padding: 10px;
	width: 60%;
	line-height: 1.5;
	border-radius: 5px;
	border: 1px solid #ccc;
}
#top #container .sec0010 .inner .form .f_info .cmxform input[type='reset'],
#top #container .sec0010 .inner .form .f_info .cmxform input[type='submit'],
#top #container .sec0011 .inner .form .f_info .cmxform input[type='reset'],
#top #container .sec0011 .inner .form .f_info .cmxform input[type='submit']{
	margin-top:20px;
	padding:10px 20px;
	background:#27689b;
	color:#fff;
	border-radius:4px;
	font-size:1vw;
	border:none;
}
#top #container .sec0010 .inner .form .f_info .cmxform .ttst:hover,
#top #container .sec0011 .inner .form .f_info .cmxform .ttst:hover{
	opacity: 0.7;
}
	@media screen and (max-width: 767px) {
		#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol .pri_to{
			font-size:3.5vw;
		}
		#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li label em,
		#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li label em{
			font-size:1.8vw;
		}
		#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li input[type='text'],
		#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li input[type='tel'],
		#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li input[type='email'],
		#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li input[type='text'],
		#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li input[type='tel'],
		#top #container .sec0011 .inner .form .f_info .cmxform fieldset ol li input[type='email']{
			width: 100%;
			padding: 0.5em 0.3em;
			margin:2px;
		}
		#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li.relabel3 label{
			width:100%;
		}
		#top #container .sec0010 .inner .form .f_info .cmxform fieldset ol li textarea{
			padding: 10px;
			width: 98%;
		}
		#top #container .sec0010 .inner .form .f_info .cmxform input[type='reset'],
		#top #container .sec0010 .inner .form .f_info .cmxform input[type='submit'],
		#top #container .sec0011 .inner .form .f_info .cmxform input[type='reset'],
		#top #container .sec0011 .inner .form .f_info .cmxform input[type='submit']{
			font-size:4vw;
		}
	}
/*--------------------------------------------------------
	Footer Part2
---------------------------------------------------------*/

/* ---- #fnav ---- */

#fnav{
	padding: 30px 0;
	border-top: 1px solid #ddd;
	float:clear;
}
#fnav .container{
	/*padding-bottom:150px;*/
}
	@media (max-width:767px){/*991px以下*/
		#fnav{
			display: block;
			padding: 15px 0;
		}
	}

	@media (max-width:767px){
		#fnav .container{
			padding: 0;
		}
	}

.row{
	display:-ms-flexbox;
	display:flex;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
	/*margin-right:-15px;
	margin-left:-15px;*/
	width:80%;
	margin:0 auto;
}

.justify-content-center{
	-ms-flex-pack:center!important;
	justify-content:space-between!important;
}

.align-items-center{
	-ms-flex-align:center!important;
	align-items:center!important;
	align-content:center;
}

.fnav-menu{
	list-style:none;
	display:flex;
	align-items:center;
	margin:-2px 0;
	line-height:1;
}
	@media only screen and (max-width:991px){
		.fnav-menu{
			display:none;
		}
	}

.fnav-menu .fnav-link,
.fnav-menu .fnav-link:hover,
.fnav-menu .fnav-link:active,
.fnav-menu .fnav-link:focus{
	font-size:14px;
	opacity:1;
	white-space:nowrap;
	line-height:1;
	color:#333;
	padding: 2px .25em;
	margin: -2px .25em;
	border-radius:2px;
}
.fnav-menu .fnav-link:hover,
.fnav-menu .fnav-link:active,
.fnav-menu .fnav-link:focus{
	background:#27689B;
	color:#fff;
}
.fnav-menu .fnav-item + .fnav-item{
	margin-left:1px;
}
/*-----------------------------------
	footer 固定部分
-------------------------------------*/
.fnav-btn{
	position:fixed;
	left:0;
	right:0;
	bottom:0;
	z-index:999;
	padding:10px;
	background: rgba(0,0,0,.5);
}
	@media only screen and (max-width:991px){
		.fnav-btn{
			padding:0px;
			background: #fff;
			border-top:1px solid #ddd;
		}
	}
.d-lg-block{
	display:block!important
}
	@media only screen and (max-width:991px){
		.d-none{
			display:none!important
		}
	}
.d-lg-none{
	display:none!important
}
	@media only screen and (max-width:991px){
		.d-block{
			display:block!important
		}
	}
.fnav-btn ul{
	display:table;
	width:100%;
	table-layout:fixed;
	margin:0;
}
	@media only screen and (max-width:991px){
		.fnav-btn ul{
			background:#fff;
		}
	}
.fnav-btn .fnav-item{
	display:table-cell;
	vertical-align:middle;
	padding:0 1px;
	text-align:center;
	height:auto;
}
	@media only screen and (max-width:991px){
		.fnav-btn .fnav-item{
			padding: 1px;
		}
	}
.fnav-btn .fnav-link,
.fnav-btn .fnav-link:hover,
.fnav-btn .fnav-link:active,
.fnav-btn .fnav-link:focus{
	display:block;
	background:#27689B;
	color:#fff;
	font-size:16px;
	line-height:20px;
	padding:20px 15px;
	position:relative;
	text-decoration:none;
	margin:0;
}
	@media only screen and (max-width:991px){
		.fnav-btn .fnav-link,
		.fnav-btn .fnav-link:hover,
		.fnav-btn .fnav-link:active,
		.fnav-btn .fnav-link:focus{
			display:block;
			font-size:10px;
			line-height:10px;
			padding:3px 2px;
			position:relative;
			text-decoration:none;
			margin:0;
		}
	}

.fnav-link:hover,
.fnav-btn .fnav-link:active,
.fnav-btn .fnav-link:focus{
	opacity:.75;
}
	@media only screen and (max-width:991px){
		.fnav-link:hover,
		.fnav-btn .fnav-link:active,
		.fnav-btn .fnav-link:focus{
			opacity:1;
		}
	}
.fnav-btn .fnav-link:before{
	font-family: 'Font Awesome\ 5 Pro';
	width: 1em;
	text-align: center;
	font-weight: bold;
	font-size:16px;
	line-height: 1;
	margin-right: 0.5em;
}
	@media only screen and (max-width:991px){
		.fnav-btn .fnav-link:before{
			width: 1em;
			display:block;
			text-align: center;
			font-weight: bold;
			font-size:16px;
			line-height: 1;
			margin: 2px auto 1px;
		}
	}
.fnav-link.home,
.fnav-link.home:hover,
.fnav-link.home:active,
.fnav-link.home:focus{
	background: #eb8845;
}
.fnav-link.mail,
.fnav-link.mail:hover,
.fnav-link.mail:active,
.fnav-link.mail:focus{
	background:#27689B;
}
.fnav-link.tel,
.fnav-link.tel:hover,
.fnav-link.tel:active,
.fnav-link.tel:focus{
	background: #69B82D;
}
.fnav-link.ptop,
.fnav-link.ptop:hover,
.fnav-link.ptop:active,
.fnav-link.ptop:focus{
	background:#27689B;
}

	@media only screen and (max-width:991px){
		.fnav-link.home,
		.fnav-link.home:hover,
		.fnav-link.home:active,
		.fnav-link.home:focus,
		.fnav-link.mail,
		.fnav-link.mail:hover,
		.fnav-link.mail:active,
		.fnav-link.mail:focus,
		.fnav-link.tel,
		.fnav-link.tel:hover,
		.fnav-link.tel:active,
		.fnav-link.tel:focus,
		.fnav-link.ptop,
		.fnav-link.ptop:hover,
		.fnav-link.ptop:active,
		.fnav-link.ptop:focus{
			background:#27689B;
		}
	}

.fnav-link.home:before	{content: "\f015";}
.fnav-link.map:before	{content: "\f041";}
.fnav-link.mail:before	{content: "\f0e0";}
.fnav-link.tel:before	{content: "\f019";}
.fnav-link.ptop:before	{content: "\f077";}

#copyright{
	display:block;
	text-align:center;
	font-size:14px;
	line-height:52px;
	background: #fff;
	border-top: 1px solid #ddd;
	padding-bottom:80px;
}
	@media (max-width:767px){
		#copyright{
			line-height:30px;
			padding-bottom:40px;
			font-size:10px;
		}
	}

/* -------------------- footerここまで -------------------- */

/*--------------------------------------------------------
	Company
---------------------------------------------------------*/
.topimg_wrap img {
	max-width:100%;
}
.topimg_wrap {
	display: flex;
	width:100%;
	margin: 10px auto;
	font-family: 'Heebo', sans-serif;
	letter-spacing: 0.2em;
}
.topimg_wrap .left {
	width:35%;
	position: relative;
}
/*
疑似要素（before）で白いボックスを作り画像の上に重ねる
「transform: skewX(-18deg);」で角度をつけて平行四辺形にする
positionとrightで画像の上に重ねる
*/
.topimg_wrap .left::before {
	content: "";
	width: 163px;
	height: 100%;
	background: #fff;	/*#fff*/
	position: absolute;
	right: -81px;
	transform: skewx(-18deg);
}
.topimg_wrap .left .text-area {
	position: absolute;
	top: 60px;
	left: 60px;
}
.topimg_wrap .left .title {
	line-height: 1;
	margin-bottom:56px;
}
/*
「display: block;」を設定することで、
改行されてmargin-bottomが効くようになる。
※spanタグはデフォルトではinlineのため、
改行もされないしmargin-bottomも効かない
*/
.topimg_wrap .left .title .en {
	display: block;
	font-size: 3vw;
	font-weight: bold;
	margin-bottom: 12px;
}
.topimg_wrap .left .title .ja {
	display: block;
	font-size: 1.8vw;
	font-weight:bold;
	color:#1eaaff;
}
.topimg_wrap .left .copy {
	font-size: 0.875rem;
}
.topimg_wrap .right {
	width:65%;
}
/*
「vertical-align: bottom;」で画像の下にできる隙間を消す
「object-fit: cover;」で高さを500pxで固定したままトリミングする
※「object-fit」はIEでは正しく動作しないため注意が必要
*/
.topimg_wrap .right img {
	width: 100%;
	height: 500px;
	vertical-align: bottom;
	object-fit: cover;
}
/*-------------------------------------------
SP
-------------------------------------------*/
@media screen and (max-width: 900px) {
	/*
	PC表示の時だけ表示させたい要素に設定しておくことで、
	スマホ表示は非表示になる。
	デモサイトでは、タイトル下のテキストのbrタグに設定することで、
	PC表示の時だけbrタグが有効になりテキストが改行される。
	*/
	.pc {
		display: none;
	}
	.topimg_wrap {
		flex-direction: column;
	}
	.topimg_wrap .left {
		width: 100%;
		padding: 0 16px;
		margin-bottom: 20px;
	}
	/*
	「content: none;」を設定することで疑似要素が非表示になるので、
	画像に重ねていた四角いボックスが消える。
	*/
	.topimg_wrap .left::before {
		content: none;
	}
	.topimg_wrap .left .title .en {
		font-size: 6vw;
	}
	.topimg_wrap .left .title .ja {
		font-size:3vw;
	}
	/*
	「position: static;」で absolute を解除する
	*/
	.topimg_wrap .left .text-area {
		position: static;
	}
	.topimg_wrap .right {
		width: 100%;
	}
}

/*-------------------------------------------
会社概要
-------------------------------------------*/
div.sec01 .comp01{
	margin:20px 0;
	width:100%;
	padding:0 20px;
}
div.sec01 .comp01 .inner{
	width:80%;
	margin:0 auto;
	padding:0;
}
div.sec01 .comp01 .inner table.info{
	width:100%;
	height:auto;
	border-collapse: separate;
	border-spacing: 4px;
}
div.sec01 .comp01 .inner table.info tbody{
	border:1px solid #000;
	width:100%;
}
div.sec01 .comp01 .inner table.info tbody th{
	width:20%;
	height:auto;
	padding:15px 1% 15px 1%;
	background:#47689b;
	color:#fff;
	text-align:left;
	border:1px solid #47689b;
	font-weight:bold;
}
div.sec01 .comp01 .inner table.info tbody td{
	width:74%;
	padding:15px 1% 15px 1%;
	border:1px solid #ccc;
}

	@media screen and (max-width: 767px) {
		div.sec01 .comp01{
			padding:0;
			margin:10px auto;
		}
		div.sec01 .comp01 .inner{
			width:96%;
		}
		div.sec01 .comp01 .inner table.info{
			width:98%;
			padding:0 1%;
			margin:0 auto;
			border-spacing:0px;
		}
		div.sec01 .comp01 .inner table.info tbody th{
			width:100%;
			display:block;
			text-indent:5px;
		}
		div.sec01 .comp01 .inner table.info tbody td{
			width:100%;
			display:block;
			text-indent:5px;
		}
	}
/*-------------------------------------------
Privacy Policy
-------------------------------------------*/
div.sec01 .comp02{
	margin:20px 0;
	width:100%;
	padding:0 20px;
	/*background:#0000ff;*/
}
div.sec01 .comp02 .inner{
	width:80%;
	margin:0 auto;
	padding:20px 0;
}

div.sec01 .comp02 .inner .priv-txt{
	font-size:0.9vw;
	color:#000;
	line-height:1.5;
	padding-top:10px;
}
div.sec01 .comp02 .inner ul.plicy{
	padding:10px;
}
div.sec01 .comp02 .inner ul.plicy li{
	font-size:1vw;
	font-weight:bold;
	margin:5px 0;
	padding:5px 0;
}
div.sec01 .comp02 .inner ul.plicy li ul{
	padding:5px 5px 5px 10px;
}
div.sec01 .comp02 .inner ul.plicy li ul li{
	font-weight: normal;
	line-height:1.5;
	font-size:0.9vw;
}
div.sec01 .comp02 .inner ul.plicy li ol{
	counter-reset: item;
	list-style-type: none;
	padding-left: 1em;
}
div.sec01 .comp02 .inner ul.plicy li ol li{
	text-indent: -1.3em;
	padding-left: 1.3em;
	font-weight:normal;
	line-height:1.5;
}
div.sec01 .comp02 .inner ul.plicy li ol li:before{
	counter-increment: item;
	content: counter(item)'.';
	/* 以下は自由に装飾... */
	padding-right: .5em;
	font-weight:normal;
	/*color: #b40000;*/
}	
	@media screen and (max-width: 767px) {
		div.sec01 .comp02{
			padding:0;
		}
		div.sec01 .comp02 .inner{
			width:90%;
			margin:0 auto;
		}
		div.sec01 .comp02 .inner .priv-txt{
			font-size:3vw;
		}
		div.sec01 .comp02 .inner ul.plicy{
			padding:10px 0;
			margin:0;
		}
		div.sec01 .comp02 .inner ul.plicy li{
			font-size:3.5vw;
			padding:0;
			margin:0;
		}
		div.sec01 .comp02 .inner ul.plicy li ul{
			padding:0;
			margin:0;
		}
		div.sec01 .comp02 .inner ul.plicy li ul li{
			font-size:3.5vw;
		}
		div.sec01 .comp02 .inner ul.plicy li ol{
			padding-left: 0.5em;
		}
		div.sec01 .comp02 .inner ul.plicy li ol li{
			text-indent: -0.8em;
			padding-left: 0.8em;
		}
	}
div.retun_web{
	width:auto;
	text-align:center;
	padding:30px 0;
}
div.retun_web a{
	background:#24689b;
	padding:20px;
	color:#fff;
}

/*--------------------------------------------------------
	download PAGE
---------------------------------------------------------*/
article.downPG{
	width: 100%;
	margin: 0;
	padding: 20px 0 30px;
	position: relative;
	top: 10px;
	overflow: hidden;
}
article.downPG::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #dcdcdc;
	transform: skewY(-100deg);
	z-index: -1;
}

article.downPG::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #dcdcdc;
	transform: skewY(10deg);
	z-index: -1;
}

article.downPG .cover{
	width:80%;
	margin:0 auto;
	padding:10px:
	height:auto;
	text-align:center;
}
article.downPG .cover h2.dwn{
	text-align:center;
	font-size:2vw;
	color:#27689b;
	font-weight:bold;
	padding:10px 0;
}
	@media screen and (max-width: 767px) {
		article.downPG .cover{
			width:100%;
		}
		article.downPG .cover h2.dwn{
			font-size:5vw;
		}
	}
article.downPG .cover h3{
	font-size:1vw;
	color:#ff0000;
	padding:10px 0;
}
	@media screen and (max-width: 767px) {
		article.downPG .cover h3{
			font-size:3vw;
		}
	}
article.downPG .cover .waku{
	display:flex;
	justify-content: center;
	padding:20px;
}
article.downPG .cover .df1,
article.downPG .cover .df2{
	width:30%;
	padding:20px;
	margin:0 5px;
	border:3px solid #27689b;
	border-radius:10px;
	background:#fff;
}
article.downPG .cover .df1 .txt,
article.downPG .cover .df2 .txt{
	font-size:1.2vw;
	font-weight:bold;
	margin-bottom:20px;
}
	@media screen and (max-width: 767px) {
		article.downPG .cover .waku{
			display:block;
		}
		article.downPG .cover .df1,
		article.downPG .cover .df2{
			width:90%;
			padding:10px 0;
			margin-bottom:10px;
		}
		article.downPG .cover .df1 .txt,
		article.downPG .cover .df2 .txt{
			font-size:4vw;
		}
	}

article.downPG .cover .df1 figure,
article.downPG .cover .df2 figure{
	
}
article.downPG .cover .df1 figure a,
article.downPG .cover .df2 figure a{
	color: #27689b;
}
article.downPG .cover .df1 figure a:before,
article.downPG .cover .df2 figure a:before{
	font-family: 'Font Awesome\ 5 Pro';
	width: 1em;
	text-align: center;
	font-weight: bold;
	font-size:16px;
	line-height: 1;
	margin-right: 0.5em;
	
}
article.downPG .cover .df1 figure a:before,
article.downPG .cover .df2 figure a:before	{content: "\f019";}

